New customization CSS editor

  • Author
  • #1213590


    After spending some time modifying some parts of the CSS I can’t be more disappointed with the new CSS editor. The way it is now, every single change (even a single letter if you stop typing a little bit) is instantly live previewed, but if you have a not fast connection this take quite a long time and makes introducing changes in the CSS a nightmare. Before, I was very much faster doing this than now.
    Furthermore, the editor’s window is now much narrower and short than before the update, which makes more difficult to modify or write a new CSS.
    Is it only me who does not like this update?



    I like it precisely because you can see the result side by side with the CSS editor, but if you don’t like it you don’t have to use it: instead of Appearance > Customize > CSS, go to Appearance > Custom Design > CSS.



    Justpi thank you very much!
    I did not know that the former editor of the CSS was still there. Thank You!
    I like the new customization tool as well, except for those issues. Still, I think it could show the results of CSS changes, once you have finish the full sentence. For example, instead of trying to show what happens when you type
    it could simply wait to show the result once you complete the full sentence:
    “width: 100px;”
    it is quite annoying to wait till the page is updated with the changes, to complete the sentence. There is no obvious advantage for me on that.
    In addition, the CSS editing window is very small, it could be improved if it could be resized.
    In any case, thank you for your help. Now I know I can choose the old way when I need :-)


    The new customization is aimed at allowing you to see CSS changes, and other changes, realtime. It is still very new, and I’m sure there will be tweaking going on for a while yet. I know during early testing I was seeing code changes right before my eyes almost. One minute this happened and the next it was fixed.


    Thanks for the feedback—it’s helpful that you were specific and also proposed a solution! I will look into it. If you have time, may I ask a few questions to get a better idea of where you are coming from?

    if you have a not fast connection this take quite a long time and makes introducing changes in the CSS a nightmare

    How fast is your connection? You can find out by going to a site such as and then making a screenshot of the results:

    What OS and OS version are you using?

    Is your browser up to date? See


    One more question, do you have a lot of browser add-ons installed? If so, how many?

    Thanks so much for any additional info you can provide!


    It is still very new, and I’m sure there will be tweaking going on for a while yet.

    This is so true! We’ve already made a very nice update this week that helped custom fonts work faster—it’s so cool when we can find and update stuff like that. :) All the feedback from you guys helps!


    Hi there! I’ve tried to get back to the old editor and to no avail … I followed the directions on this thread – no change. The only reason I really even want to see the old version is to view the theme CSS … Please assist! The blog I need help with is



    yes … I’ve checked that out … what I’m really trying to do is float my social icon bar which is currently done in a text widget… I need to either move the widget underneath my site title OR float it in the top right corner somehow … any suggestions?



    ? You have already done this for the Nashville logo (#text-3). The easiest thing to do is copypaste the code of the social icons into the Nashville widget then delete the other Text widget.


    @shamillewharton, I don’t see your social icons in your sidebar. I need to see that to give you the correct code, and which would you prefer? Right side or left under the site title?

    The problem with the CSS now is that with the new way is doing the CSS, there are several CSS files, not just one, so stuff is sort of scattered around. That was one of the reasons the link was removed from the CSS edit page, that and there were far too many people pasting the entire original CSS into the editor to just make a few minor changes and finding the images used in the theme itself went walkabout.



    By the way, shamillewharton, your social media widget includes some useless code: you don’t need the text-align rule in the div, you don’t need the image classes, you don’t need the width and height indications, and you don’t need the margin:0 (fourth icon). All you need is this:
    <div align="center"><a title="twitter" href="" target="_blank"><img style="margin-right:10px;" alt="twitter" src="" /></a><a title="facebook" href="" target="_blank"><img style="margin-right:10px;" alt="facebook" src="" /></a><a title="rss feeder" href="" target="_blank"><img style="margin-right:10px;" alt="rss" src="" /></a><a title="email me" href="mailto:(email redacted)" target="_blank"><img alt="mail" src="" /></a></div>



    Hi designsimply
    Thanks a lot for your help and for attending my problems. Following your instructions and justpi I have been able to use the old CSS editor, which for me works better. Unfortunately, it seems that now it is not accesible anymore!!!
    I have made many changes in the CSS and I prefer to see as much as I can on the screen. I don’t have a small screen (27″), but still, the new tool only allow me to see a few lines of code and short ones. I am sure it is just my particular case, and the tool is very helpful for just minor changes of the CSS (I think).
    I have just measured the speed of my conection. It is 22.84Mps (downloading) and 1.05 Mbps (uploading). I have made a screenshot , but I don’t know how to send it! I am at Madrid. Spain. My browser has almost no add-ons installed (only Windows Media Player Extension for HTML5 is on) and it is up to date (Chrome version 26.0.1410.64 m). I am using Windows 7 64bit and running on a Intel (email redacted), 16MB RAM, 1x150GB SSD and 1x750GB HDD, although I think this is not very relevant.
    But, please, don’t misunderstand me, I do like the new tool. It is just the CSS management what is not OK in my case. And I think there are some space for improving it without changing nothing of its current functionality. For example:

    1. It should be possible to resize the window. Both in width and height. In fact, in height there are much room below which is empty and could be better used with the CSS editor. If the window where I am writing this comment can be resized I am sure resizing the CSS window can’t be dificult to add.

    2. Don’t try to show me the changes without finishing the full sentence. It has no sense to do it as I type it just because the sentence has no sense :-).

    3. For the guys like me that has to make a lot of changes in the CSS, a button to switch on/off the live-view of the CSS changes would be very useful, and still will not affect the functionality of the tool.

    Thanks a lot and excuse me for the this extra long comment



    One more thing, with the old CSS editor I had access to different previous versions of my CSS. Now I can’t. Why?


    That will show up again in the new customize page, but for now, add this to the end of your URL and you can still get to the old page.




    Thanks a lot, thesacredpath. I got back my beloved old CSS editor! ;-)


    You are welcome.


    Thank you all sooo very much! Think I got that issue resolved.


    You are welcome.

The topic ‘New customization CSS editor’ is closed to new replies.