For advanced WordPress users, this will show you how to customize the WP-Admin of WordPress. This post is Macintosh specific and does not apply to windows and IIS servers. If you are web developer that has used WordPress to the point that you are making your own user templates, then you may have notice that there are not built in custom features for the back-end with the exception of changing the color scheme between two preset. Before you can start changing you live website you need to work with a fall safe. To do this download a free copy of MAMP which is a local virtual Apache server. Download a copy of the most recent WordPress. Configure WordPress to the MAMP using root for the user name and password for the database (if using the free version use localhost for the database). Once a local version is up and running a fully configured, go into into the root folder and locate the wp-includes folder in there you will follow this path to get to the file need to be modified: js » tinymce » tiny_mce.js. Open tiny_mce.js. Duplicate the file to your desktop just in case then open the original in Dreamweaver or text editor of your choice. Here is where it get annoying, because as you may notice the entire document consist of one line. So if your not using word wrap then I suggest you change your preferences. Next bring up Find/Replace (common shortcut cmd + F). Type into the find box “<body“, from there it should bring you to a section of code like this:
if(h<100)h=100;t.iframeHTML=s.doctype+'
<html>
<head xmlns="http://www.w3.org/1999/xhtml">
<base href="'+t.documentBaseURI.getURI()+'" />';
t.iframeHTML+='<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />';
if(tinymce.relaxedDomain)t.iframeHTML+='
<script type="text/javascript">document.domain = "'+tinymce.relaxedDomain+'";</script>';
bi=s.body_id||'tinymce';if(bi.indexOf('=')!=-1){bi=t.getParam('body_id','','hash');
bi=bi[t.id]||bi;}bc=s.body_class||'';
if(bc.indexOf('=')!=-1){bc=t.getParam('body_class','','hash');bc=bc[t.id]||'';}t.iframeHTML+='
</head>
<body id="'+bi+'" class="mceContentBody '+bc+'">
</body>
</html>';
It will be all on one line but so you can see it i broke it up (don’t not do the same, leave it all on one line). Inside the code before the closing “</head>” tag, add the following:
<style type="text/css"></style>
From in there you can add your settings, like “background-color:#FFFFFF;“. Or link up an external CSS document but you need to use an absolute location and not a relative. Save the document and open the local WordPress. Once open got to either and existing post or create a new post. The change will not be seen right away, but don’t worry the problem is not with your coding, however it’s the cache loading from memory. To get around this either clear the cache or hit “cmd + shift + R” to preform a server resent. If everything goes to plan the you will see the change, to which all that’s left is to upload to the existing WordPress on the server. Now you’ll have a real preview of what it will lookm like on the site and you’ll not need to press the preview button again. Any problems just add a comment and I’ll help.
Hello, I came across this blog post while searching for help with JavaScript. I have recently changed browsers from Safari to Firefox 3.2. Just recently I seem to have a problem with loading JavaScript. Every time I browse website that requires Javascript, the page freezes and I get a “runtime error javascript.JSException: Unknown name”. I can’t seem to find out how to fix it. Any aid is greatly appreciated! Thanks