Announcement

Do not use the forums to submit bug reports, feature requests or patches, submit a New Ticket instead.

#1 2010-08-24 10:05:09

hraban
New member
Registered: 2010-08-24
Posts: 2

CSS style does not load? Or the layout broke because of the page sourc

Hello,
I have no idea how come but I faced a problem with Xinha layout on my website.
Here is the image: http://img837.imageshack.us/img837/2522/layoutn.jpg
CSS file:  http://leif.ru/other/default.css

Here is the page source code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
    Design by Free CSS Templates
    http://www.freecsstemplates.org
    Released for free under a Creative Commons Attribution 2.5 License
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="../default.css" rel="stylesheet" type="text/css" />

  <script type="text/javascript" src="xinha/XinhaLoader.js?lang=en&skin=silva"></script>
  <script type="text/javascript">
    _editor_icons = "Tango" // You can pass arguments via the script URL or embed them here.
    _editor_url = "xinha/";
  </script>

  <script type="text/javascript" src="xinha/XinhaConfig.js"></script>



</head>
<body>
<div id="outer">
    <div id="header">
        <h1><a href="#">GenericBlue</a></h1>
        <h2>by Free CSS Templates</h2>

    </div>
    <div id="menu">
        <ul>
            <li class="first"><a href="#" accesskey="1" title="">Home</a></li>
            <li><a href="#" accesskey="2" title="">About Us</a></li>
            <li><a href="#" accesskey="3" title="">Products</a></li>
            <li><a href="#" accesskey="4" title="">Services</a></li>

            <li><a href="#" accesskey="5" title="">Contact Us</a></li>
        </ul>
    </div>
    <div id="content">
        <div id="tertiaryContent">
            <h3>Lorem ipsum dolor</h3>
            <p>Vivamus sagittis bibendum erat. Curabitur lorem ipsum dolore malesuada. <a href="#">More…</a></p>

            <h3>Nunc pellentesque</h3>
            <ul>
                <li><a href="#">Vivamus id arcu</a></li>
                <li><a href="#">Duis congue ultricies</a></li>
                <li><a href="#">Purus in mollis purus</a></li>
                <li><a href="#">Orci nonummy fringilla</a></li>

                <li><a href="#">Pellentesque at lorem</a></li>
                <li><a href="#">Enim vivamus convallis</a></li>
                <li><a href="#">Ipsum vitae felis</a></li>
                <li><a href="#">Integer facilisis</a></li>
                <li><a href="#">Sagittis Bibendum Erat</a></li>
                <li><a href="#">Malesuada Turpis</a></li>

                <li><a href="#">Quis Gravida Massa</a></li>
                <li><a href="#">Inerat Viverra Ornare</a></li>
            </ul>
            <h3>Malesuada vivamus</h3>
            <ul>
                <li><a href="#">Orci nonummy fringilla</a></li>
                <li><a href="#">Enim vivamus convallis</a></li>

                <li><a href="#">Duis congue ultricies</a></li>
                <li><a href="#">Purus in mollis purus</a></li>
                <li><a href="#">Malesuada Turpis</a></li>
                <li><a href="#">Integer facilisis</a></li>
                <li><a href="#">Quis Gravida Massa</a></li>
                <li><a href="#">Pellentesque at lorem</a></li>

                <li><a href="#">Ipsum vitae felis</a></li>
                <li><a href="#">Sagittis Bibendum Erat</a></li>
            </ul>
            <div class="xbg"></div>
        </div>
        <div id="primaryContentContainer">
            <div id="primaryContent">
                <h2></h2>

                    <form name=editPage method=POST action="?act=pages&subact=edit&editid=1">
    Заголок страницы:<br>
    <input type=text name=pageTitle value=Главная size=100%><br>
     <textarea name="pageBody" id="pageBody" rows="25" cols="80">
Это Главная страница<br>
Тут всякий текст<br>
Ляляля
    </textarea>
            </div>
        </div>
        <div id="secondaryContent">
                                                <h3>Страницы</h3>

                                <ul>
                    <li><a href="?act=pages">Список страниц</a></li>
                <li><a href="#">Новая страница</a></li>
                </ul>
            
        </div>
        <div class="clear"></div>
    </div>
    <div id="footer">

        <p>Copyright © 2006 Sitename.com. Designed by <a href="http://www.freecsstemplates.org">Free CSS Templates</a></p>
    </div>
</div>
</body>
</html>

XinhaConfig.js:

xinha_editors = null;
xinha_init    = null;
xinha_config  = null;
xinha_plugins = null;

// This contains the names of textareas we will make into Xinha editors
xinha_init = xinha_init ? xinha_init : function()
{
   /** STEP 1 ***************************************************************
   * First, specify the textareas that shall be turned into Xinhas. 
   * For each one add the respective id to the xinha_editors array.
   * I you want add more than on textarea, keep in mind that these 
   * values are comma seperated BUT there is no comma after the last value.
   * If you are going to use this configuration on several pages with different
   * textarea ids, you can add them all. The ones that are not found on the
   * current page will just be skipped.
   ************************************************************************/

  xinha_editors = xinha_editors ? xinha_editors :
  [
    'pageBody'
  ];
  
  /** STEP 2 ***************************************************************
   * Now, what are the plugins you will be using in the editors on this
   * page.  List all the plugins you will need, even if not all the editors
   * will use all the plugins.
   *
   * The list of plugins below is a good starting point, but if you prefer
   * a simpler editor to start with then you can use the following 
   * 
   * xinha_plugins = xinha_plugins ? xinha_plugins : [ ];
   *
   * which will load no extra plugins at all.
   ************************************************************************/

  xinha_plugins = xinha_plugins ? xinha_plugins :
  [
   'CharacterMap',
   'ContextMenu',
   'SmartReplace',
   'Stylist',
   'ExtendedFileManager',
   'Linker',
   'SuperClean',
   'TableOperations'
  ];
  
         // THIS BIT OF JAVASCRIPT LOADS THE PLUGINS, NO TOUCHING  :)
         if(!Xinha.loadPlugins(xinha_plugins, xinha_init)) return;


  /** STEP 3 ***************************************************************
   * We create a default configuration to be used by all the editors.
   * If you wish to configure some of the editors differently this will be
   * done in step 5.
   *
   * If you want to modify the default config you might do something like this.
   *
   *   xinha_config = new Xinha.Config();
   *   xinha_config.width  = '640px';
   *   xinha_config.height = '420px';
   *
   *
   * For a list of the available configuration options, see:
   * http://trac.xinha.org/wiki/Documentation/ConfigVariablesList
   *
   *************************************************************************/

   xinha_config = xinha_config ? xinha_config() : new Xinha.Config();
        
  //this is the standard toolbar, feel free to remove buttons as you like
  xinha_config.toolbar =
  [
    ["popupeditor"],
    ["separator","formatblock","fontname","fontsize","bold","italic","underline","strikethrough"],
    ["separator","forecolor","hilitecolor","textindicator"],
    ["separator","subscript","superscript"],
    ["linebreak","separator","justifyleft","justifycenter","justifyright","justifyfull"],
    ["separator","insertorderedlist","insertunorderedlist","outdent","indent"],
    ["separator","inserthorizontalrule","createlink","insertimage","inserttable"],
    ["linebreak","separator","undo","redo","selectall","print"], (Xinha.is_gecko ? [] : ["cut","copy","paste","overwrite","saveas"]),
    ["separator","killword","clearfonts","removeformat","toggleborders","splitblock","lefttoright", "righttoleft"],
    ["separator","htmlmode","showhelp","about"]
  ];

   // To adjust the styling inside the editor, we can load an external stylesheet like this
   // NOTE : YOU MUST GIVE AN ABSOLUTE URL
   xinha_config.pageStyleSheets = [ _editor_url + "examples/files/full_example.css" ];
   //if you're using Stylist, import a stylesheet like this
   xinha_config.stylistLoadStylesheet(_editor_url + "examples/files/stylist.css");


  /** STEP 4 ***************************************************************
   * We first create editors for the textareas.
   *
   * You can do this in two ways, either
   *
   *   xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins);
   *
   * if you want all the editor objects to use the same set of plugins, OR;
   *
   *   xinha_editors = Xinha.makeEditors(xinha_editors, xinha_config);
   *   xinha_editors.myTextArea.registerPlugins(['Stylist']);
   *   xinha_editors.anotherOne.registerPlugins(['CSS','SuperClean']);
   *
   * if you want to use a different set of plugins for one or more of the
   * editors.
   ************************************************************************/

  xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins);

  /** STEP 5 ***************************************************************
   * If you want to change the configuration variables of any of the
   * editors,  this is the place to do that, for example you might want to
   * change the width and height of one of the editors, like this...
   *
   *   xinha_editors.myTextArea.config.width  = '640px';
   *   xinha_editors.myTextArea.config.height = '480px';
   *
   ************************************************************************/


  /** STEP 6 ***************************************************************
   * Finally we "start" the editors, this turns the textareas into
   * Xinha editors.
   ************************************************************************/

  Xinha.startEditors(xinha_editors);
}

Xinha.addOnloadHandler(xinha_init); // this executes the xinha_init function on page load
                                     // and does not interfere with window.onload properties set by other scripts

Thank you

Last edited by hraban (2010-08-24 11:47:00)

Offline

#2 2010-08-24 19:28:02

gogo
Xinha Leader
From: New Zealand
Registered: 2005-02-11
Posts: 1,015
Website

Re: CSS style does not load? Or the layout broke because of the page sourc

I would guess you have some other CSS from outside Xinha which interferes with Xinha CSS.  You must use your web browser developer tools (eg Firebug or Chrome's Developer Tools) to inspect the button elements and see what CSS is wrong.


James Sleeman

Offline

Board footer

Powered by FluxBB