Buttons on toolbar not appearing

Hello,

Recently I intergrated CKEditor into my textarea but I see a grey toolbar but with no icons. I can type in the white part (textarea).

But I see no buttons at all.

Heres my coding...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
  <style>
  #win_but, #web_but, #and_but { list-style-type: none; display: inline;}
     div { display:none; }
      #win { display:none; )
       { display:none; }
       li { display:inline-block; list-style-type: none;}
       
       textarea { width: 900px; height: 250px; }
       
      </style>

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
 <script type="text/javascript" src="ckeditor.js"></script>

<!-- /TinyMCE -->
<body>
<ul>
 <textarea cols="80" id="editor_kama" name="editor_kama" rows="10" cols="20">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>
         <script type="text/javascript">
         //<![CDATA[

            CKEDITOR.replace( 'editor_kama',
               {
                  skin : 'kama'
               });

         //]]>
         </script>
      
      <li id="win_but"><input type="button" value="Windows"></li>
     <li id="web_but"><input type="button" value="Web Development"></li>
     <li id="and_but"><input type="button" value="Android"></li>
     
     </ul>
     <!-- Form --->
     <div id="win">
     <form action="test.php" method="post">
      <select name="windows">
     <option value="tut_win7">Windows 7</option>
     <option value="tut_vista">Windows Vista</option>
     <option value="tut_xp">Windows XP</option>
     </select>
     <input type="submit">
     </form>
     </div>
     <div id="web">
     <form action="test.php" method="post">
     Topic: <select name="web_development">
     <option value="tut_html">HTML</option>
     <option value="tut_php">PHP</option>
     <option value="tut_css">CSS</option>
     </select>
    <br /><br />
     Name: <input type="text"><br /><Br />
     Icon: <input type="file"><br />
     <br />
     Post: <Br />
     <textarea name="post" cols="100" rows="20"></textarea>
     <br />
     <input type="submit">
     </form>
     </div>
       <div id="and">
     <form action="test.php" method="post">
     Topic: <select name="android">
     <option value="tut_tab">Tablet</option>
     </select>
    <br /><br />
     Name: <input type="text" name="name"><br /><Br />
     Icon: <input type="file" name="icon"><br />
     <br />
     Post: <Br />
    
     

     <br />
     
     <br />
     <input type="submit">
     </form>
     </div>
<script>
        

      $("#win_but").click(function () {
        $("ul").fadeOut(500, function () {
         });
          $("#win").fadeIn(3000, function () {
           
          });
         
        }); 

      $("#web_but").click(function () {
      $("ul").fadeOut(500, function () {
         });
          $("#web").fadeIn(3000, function () {
           
          });
         
        }); 
      
      $("#and_but").click(function () {
        $("ul").fadeOut(500, function () {
         });
          $("#and").fadeIn(3000, function () {
           
          });
         
        }); 
      

      </script>

</body>
</html>

Fri, 01/20/2012 - 11:28

Anna

Joined: 14/12/2010

Posts: 1369

Re: Buttons on toolbar not appearing

Your code is pretty complex, so I doubt someone will be willing to debug this issue for you. Why don't you try to first integrate CKEditor into a much simple page, and then try to add your code step-by-step in order to see what causes the problems?

Documentation Manager, CKSource

See CKEditor 5 docs, CKEditor 4 docs, CKEditor 3 docs, CKFinder 3 docs, CKFinder 2 docs for help.
Visit the new CKEditor SDK for samples showcasing editor features to try out and download!

Fri, 01/20/2012 - 17:20

lewes

Joined: 19/01/2012

Posts: 3

Re: Buttons on toolbar not appearing

Let me try that. I'll report back once I've done it.

Fri, 01/20/2012 - 17:27

lewes

Joined: 19/01/2012

Posts: 3

Re: Buttons on toolbar not appearing

Works fine on a test page, heres the test3.php code.

<html>
<head>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
 <script type="text/javascript" src="ckeditor.js"></script>
</head>
<body>
<textarea cols="80" id="editor_kama" name="editor_kama" rows="10" cols="20">&lt;p&gt;This is some &lt;strong&gt;sample text&lt;/strong&gt;. You are using &lt;a href="http://ckeditor.com/"&gt;CKEditor&lt;/a&gt;.&lt;/p&gt;</textarea>
     
   <script type="text/javascript">
         //<![CDATA[

            CKEDITOR.replace( 'editor_kama',
               {
                  skin : 'kama'
               });

         //]]>
         </script>
</body>
</html>