Modify the Width of Theme ZeePersonal

zeePersonal is one of my favourite WordPress themes. The drak background, two columns, and the eye-catching logo perfectly meet my taste. The following modifications will make the theme better.

1. Widen the theme

The default width of theme zeePersonal is 980 pixel, but it has a fat sidebar and large value of the the property Padding and Margin. So the posts area looks very narrow, which gives readers a bad feeling. So I tried to edit the CSS style sheet to widen the theme, whick involves two aspects: Firstly, widen the global width of the theme so it looks better with widescreen displays. ( I guess few people use monitors less than 1280 pixels today.) Secondly, widen the posts area while narrow the sidebar, which make the website look well-balanced.

Specific steps are as follows: 1. File style.css, paragraph WRAPPER, ID selector #custom_header_bg: Modify property width to 960px from 930px, and remember that you should also enlarge your logo. 2. File style.css, paragraph STRUCTURE, ID selector #wrap: modify property width from 980px to 1010px, which will affect the global width of the theme framwork. 3. File style.css, paragraph STRUCTURE, ID selector #content, modigy the property width from 590px to 650px, after which you will have a broader posts area. 4. File style.css, paragraph STRUCTURE, class selector .fullwidth, modify the property width from 930px to 960px, I just think this should be done but I ‘ve not find it take any effects. 5. File style.css, paragraph SIDEBAR, ID selector #sidebar: modify property margin-left from 650px to 710px, coordinating to a broader posts area. 6. File style.css, paragraph SIDEBAR, ID selector #sidebar: decrease the value of property width from 290 to 260, which will narrow the sidebar. 7. Theme function file function.php, paragraph THEME SETUP, function themezee_setup(), just below the annotation Add Custom Header, modify the property width from 930 to 960, while height from 160 to 165 proportionally, after which your theme could automatically crop the image to the modified size when you upload a new logo.

2. Add a favicon.ico file to the website

A favicon (short for favourite icon), is a small icon file, usually 16×16 pixels, associated with a particular website or webpage. You can easily create such an icon and install it into a website or a webpage, and graphical web browsers will then make use of it. Browsers the provide favicon support typically show a page’s favicon in the broswer’s address bar or title bar next to the page’s title. Of course you can also find it next to the page’s name in a list of bookmarks as its name is Favicon. To add a favicon to your pages is easy, just add the following codes into your webpage’s tag Head. For example, you can add it to the head.php file of your current theme.

<link rel="shortcut icon" href="http://blog.xieyc.com/wp-content/themes/tearsnowfan/images/favicon.ico" type="image/x-icon" />

 

So easy, Enjoy!

 

CLICK HERE to view the Simplified Chinese version of this post.

4 comments

  1. Susan says:

    Writing articles is tedious.I know how you can get unlimited content for your blog, type in google:

    Anightund’s rewriter

    • Jenn says:

      Der rührige Professor aus Freiburg glänzt mit einer Falschaussage. Ich habe mit ihm bereits am 5. Dezember einen ausführlichen Mail-Verkehr geführt und diese E-Mail auch Herrn Gieringer weeelrgietitet. Siehe auch der heutige Leserbrief in der NZZ.Die nicht überzeugenden Antworten von Herrn Eichenberger können bei mir eingesehen werden.

    • Minimal government would not require many taxes as it would not have large expenditures; it would not interfere in labor markets, letting individual workers deal with large business firms as ordinary people deal with the grocery store.—————————–As opposed to big government who’s so much help to the individual worker? Riiight.

    • Great post サイトにつながらない | ここみの毎日 I think website owners should acquire a lot from this site its very user pleasant. So much wonderful info on here .

Leave a Reply

Your email address will not be published. Required fields are marked *

:wink: :-| :-x :twisted: :) 8-O :( :roll: :-P :oops: :-o :mrgreen: :lol: :idea: :-D :evil: :cry: 8) :arrow: :-? :?: :!: