Jump to:

22979 Posts in 11815 Topics by 2826 members

General Questions

SilverStripe Forums » General Questions » 2.3.5 CMS style drop down problems?

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1641 Views
  • Hello_electro
    Avatar
    Community Member
    80 Posts

    2.3.5 CMS style drop down problems? Link to this post

    Anyone else having problems with the "styles" drop down in the cms not working?

    Not even the general ones in the .typography file are populating.

    i did re-order the typography.css .layout.css and form.css files in the requirement class, does this have anything to do with it you think??

  • teejay
    Avatar
    Community Member
    63 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    do you have any content in the style box ?

    u need to add styles to this css file.

    cms/css/editor.css

    if u do so it should appear in the styles box

  • Hello_electro
    Avatar
    Community Member
    80 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    If i recall, i tried this and no luck. There were default options that populated in older versions of Silverstripe that I have used like (e.g. .floatLeft) but those are not there either. I will try again and see what happens.

    Thanks!

  • Carolg
    Avatar
    Community Member
    9 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    I'm having the same problem with 2.3.6 - nothing appears in the Styles drop down menu.

    I've tried with 2 different installations of SS on 2 different servers, tried with Firefox and Safari (no IE to hand at the moment), cleared the browser cache, flushed the SS admin pane.
    I've also tried switching the template from Tutorial to my custom template to Blackcandy with no luck.

    I checked the demo install on the SS website and this also doesn't show anything in the Styles drop down.

    Any ideas? I am a beginner so may have missed something obvious...
    Carol

  • Hello_electro
    Avatar
    Community Member
    80 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    Carolg:

    teejay was right that you have to check the file: cms/css/editor.css

    I am not sure why this is but it looks like that css file was left empty. I believe perhaps it was not in the past. You can create custom styles in there and will show in the style drop down in the CMS. You can also copy over the main classes (i.e. .right) and it will allow the CMS to pick up these styles so they are represented in the administration pages also.

    Hope this helps! Below is what I have in there. some of it is specific to my site.

    /**
    * Default Editor Styles for the CMS
    */

    .mceItemFlash {
       border: 1px dotted #f00;
    }

    body.mceContentBody {
       min-height: 200px;
       font-size: 62.5%;
    }

    /*
    body.mceContentBody a.broken {
       background-color: #FF7B71;
       border: 1px red solid;
       color: #fff;
       padding: 1px;
       text-decoration: underline;
    }
    */

    /**
    * SilverStripe Black Candy Theme
    * http://www.silverstripe.com
    *
    * This typography file is included in the WYSIWYG editor and the front end. It provides
    * a place to add link styles and font styles you would like in the CMS and the Front End.
    */

    /* GENERIC STYLES
    -------------------------------------------- */

    * {
       font-family: Verdana, Lucida, Arial, sans-serif;
    }

    /* PARAGRAPHS
    -------------------------------------------- */
    p {
       color: #333;
       line-height: 18px;
       font-size: 11px;
       margin: 0 0 18px 0;
       text-align:justify;
    }

    /* QUOTES
    -------------------------------------------- */
    blockquote {
       margin: 10px;
       font-size: 1.4em;
       color: #777;
       font-style: italic;
    }   
    q {
       display:block;
       font-size: 0.8em;
       margin: 1em 1em;
       padding: 0.5em;
       border: 1px #ccc solid;
    }

    /* LINKS
    -------------------------------------------- */

    a {
       text-decoration: underline;
       color: #666;
    }
        a:hover {
          text-decoration: none;
       }

       /* LINK ICONS - shows type of file
       ------------------------------------ */
        a[href$=".pdf"],
        a[href$=".PDF"],
        a.pdf {
          padding: 2px;
          padding-left: 20px;
          background: url(../images/icons/page_white_acrobat.png) no-repeat left center;
       }
        a[href$=".doc"],
        a[href$=".DOC"],
        a.doc {
          padding: 2px;
          padding-left: 20px;
          background: url(../images/icons/page_word.png) no-repeat left center;
       }
        a[href$=".xls"],
        a[href$=".XLS"],
        a.xls {
          padding: 2px;
          padding-left: 20px;
          background: url(../images/icons/page_excel.png) no-repeat left center;
       }
        a[href$=".gz"],
        a[href$=".GZ"],
        a[href$=".gzip"],
        a[href$=".GZIP"],
        a[href$=".zip"],
        a[href$=".ZIP"],
        a.archive {
          padding: 2px;
          padding-left: 20px;
          background: url(../images/icons/page_white_zip.png) no-repeat left center;
       }
        a[href$=".exe"],
        a[href$=".EXE"],
        a.application {
          padding: 2px;
          padding-left: 20px;
          background: url(../images/icons/application.png) no-repeat left center;
       }

    /* LIST STYLES
    -------------------------------------------- */
    ul,
    ol {
       margin: 18px 0 18px 24px;
       color: #333;
    }

    ol li {
       margin-top:10px;
    }

    + ul {
       list-style-image:url(../images/bulletRTGrey.gif);
    }

        li {
          margin: 5px 10px;
          font-size: 11px;
          list-style-image:url(../images/bulletRTGrey.gif);
       }
           li li {
             font-size: 10px;
          }
          
    /* HEADER STYLES
    -------------------------------------------- */

    h1,
    h2 {
       color: #74251b;
       margin: 0 0 18px 0;
       font-weight: 300;
       font-family: Verdana, Lucida, Arial, sans-serif;
    }

    h1 a,
    h2 a{
       font-family: Verdana, Lucida, Arial, sans-serif;
    }

    h1 {
       font-size: 24px;
    }
    h2 {
       font-size: 20px;
    }   

    h2.blogTitleHeader,
    h2.blogTitleHeader a{
       font-size:16px;
       color:#74251b;
       font-family: Verdana, Lucida, Arial, sans-serif;
    }

    h3 {
       color: #222;
       margin: 0 0 18px 0;
       font-weight: 300;
       font-size: 18px;
    }
    h4 {
       font-size: 16px;
       color: #222;
       width: 95%;
       font-weight: 300;
       line-height: 18px;
       border-bottom: 1px solid #ccc;
       margin: 0 0 16px 0;
    }
    h5 {
       font-size: 14px;
       color: #222;
       font-weight: 700;
       margin: 0 0 12px 0;
    }
    h6 {
       font-size: 13px;
       color: #555;
       line-height: 1.4em;
       margin: 0 0 12px 0;
    }

    /* PRE STYLES
    -------------------------------------------- */   
    pre {
       font-family:"Courier New",Courier;
       display:block;
       font-size:1.2em;
       margin:2em 5em;
       padding:0.5em;
       border:1px #ccc solid;
       background:#eee;;
    }

    /* TABLE STYLING
    -------------------------------------------- */
    table {
       margin: 0 0 18px 0;
       font-size: 11px;
       color: #666;
       border-collapse:collapse;
    }
        tr {}
       
           td {
             border:1px solid #999;
             padding:5px;
          }
          
    td.whiteTextCell {
       color:#FFF;
    }

    tr.whiteTextCell1 {
       color:#FFF;
    }
    Red {
       color:#900;
    }

    /* WYSIWYG EDITOR ALIGNMENT CLASSES
    -------------------------------------------- */
    .left {
       text-align: left;
    }
    .center {
       text-align: center;
    }
    .right {
       text-align: right;
    }

    /* IMAGES
    -------------------------------------------- */
    img {
       border: 1px solid #999;
    }
       img.right {
          float: right;
          margin-left: 20px;
          margin-bottom:5px;
       }
       img.left {
          float: left;
          margin-right:20px;
          margin-bottom:5px;
       }
        img.leftAlone {
          float: left;
          margin-right: 100%;
       }
        img.center {
          float: none;
          margin-left: auto;
          margin-right: auto;
          display: block;
       }

  • Carolg
    Avatar
    Community Member
    9 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    Actually I tried that with no luck, but I did find a different solution to this, check http://silverstripe.org/customising-the-cms/show/276090?showPost=281006

    This worked for me, and I think is better because it's part of your mysite folder so is less likely to be overwritten during an SS upgrade.

  • Hello_electro
    Avatar
    Community Member
    80 Posts

    Re: 2.3.5 CMS style drop down problems? Link to this post

    Ah! good find. Thanks for sharing.

    1641 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.