Welcome Guest ( Log In | Register )



 
 Reply to this topicStart new topic
> Wordpress Theme Help
dhanesh
post Aug 5 2006, 03:43 PM
Post #1


Binary Geek
Group Icon

Group: Members
Posts: 444
Joined: 4-November 05
From: The Digital Arena
Member No.: 9,440
Aight .. I liked this wordpress theme called DFire, and m trying to use it on my Blog. In its default state DFire looks good (visually) but the reading part kinda looks odd. I thought of changing the font and color etc .. but since i am no good at CSS .. lol .. i thought maybe someone here could help ..

DFire Theme Download

Current Style.css :

CODE
body {
    font-family: verdana;
    font-size: 12px;
    color: #FFFFFF;
    text-align: center;
    background: #E1B26B url("images/bg.gif");
    margin: 0;
    padding: 0;
    }

/* Design Containers and Specifications */

#wrap {
    background: url("images/bgtp.gif") repeat-x;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    float: left;
    }

#keep {
    width: 765px;
    clear: left;
    margin: 0 auto;
    }

#outside {
    background: #B5B6B4 url("images/bgcon.gif") repeat-y top center;
    width: 765px;
    float: right;
    }

#inside {
    background: url("images/bghead.gif") no-repeat top center;
    width: 765px;
    clear: both;
    }

#holder {
    margin-left: 30px;
    width: 698px;
    padding: 0;
    }

* html #holder {
    margin-left: 15px;
    float: left;
    }

#search {
    background: url("images/search.gif") no-repeat bottom;
    width: 272px;
    height: 53px;
    float: left;
    text-align: left;
    }

#title {
    background: url("images/title.jpg") no-repeat;
    width: 426px;
    height: 53px;
    text-align: right;
    float: right;
    }

#menu {
    background: url("images/menu.jpg") no-repeat;
    width: 485px;
    height: 125px;
    float: left;
    text-align: left;
    }

#tree {
    background: url("images/tree.jpg") no-repeat;
    width: 213px;
    height: 153px;
    float: right;
    }

#content {
    width: 432px;
    margin-left: 20px;
    float: left;
    text-align: justify;
    font-size: 13px;
    color: #CACACA;
    font-family: verdana;
    }

* html #content {
    margin-left: 15px;
    width: 410px;
    }

#sidebar {
    width: 205px;
    float: right;
    text-align: left;
    margin: 0 35px 15px 0;
    }

* html #sidebar {
    margin: 0px;
    }

#footer {
    background: url("images/footer.jpg") no-repeat bottom;
    width: 698px;
    height: 83px;
    clear: both;
    font-family: verdana;
    }

/* Information */

#handle {
    text-align: right;
    margin: 0 0 7px 0;
    }

#inf {
    width: 99%;
    font-size: 13px;
    color: #959595;
    font-family: verdana;
    margin: 0 0 35px 0;
    padding: 0 7px;
    }

#com {
    width: 40%;
    float: left;
    }

#ent {
    width: 55%;
    float: right;
    }

#clr {
    background-color: #000000;
    width: 100%;
    clear: both;
    height: 7px;
    }

#inf ul {
    list-style-type: none;
    padding: 0;
    margin: 0 0 20px 0;
    }

#inf li {
    display: block;
    border-bottom: #4E370F 1px solid;
    padding-top: 3px;
    margin: 0;
    min-height: 20px;
    font-weight: normal;
    }

#com li a {
    text-decoration: none;
    color: #75961B;
    }

#com li a:hover {
    text-decoration: none;
    color: #99C521;
    }

#ent li a {
    text-decoration: none;
    color: #DEDDDC;
    }

#ent li a:hover {
    text-decoration: none;
    color: #FFFFFF;
    }

.intr {
    padding: 0 7px;
    }

/* Headers */

.edit, .edit a:link, .edit a:visited {
    text-align: right;
    text-transform: lowercase;
    color: #2E2E2E;
    font-size: 10px;
    float: right;
    }

.edit a:hover {
    color: #E1E1E1;
    }

h4 {
    background: url("images/sidebg.jpg") no-repeat bottom;
    width: 198px;
    height: 28px;
    text-transform: lowercase;
    margin: 0px;
    padding-right: 50px;
    color: #E5B655;
    font-size: 10px;
    text-align: right;
    font-family: verdana;
    }

* html h4 {
    padding: 0 50px 0 0;
    }

h3 {
    color: #F3F1B7;
    font-size: 18px;
    font-family: verdana;
    font-weight: bold;
    padding: 0;
    margin: 0;
    }

h1, h1 a:link, h1 a:visited {
    color: #FFA303;
    font-size: 20px;
    font-family: verdana;
    text-transform: uppercase;
    font-weight: bold;
    padding: 0;
    margin: 7px 0 0 0;
    text-decoration: none;
    }
    
.id {
    color: #686C24;
    padding-right: 3px;
    }

h2, #wp-calendar caption {
    font-weight: bold;
    padding: 0;
    margin: 0 0 10px 0;
    color: #FFFED9;
    font-size: 11px;
    text-align: center;
    font-family: verdana;
    }

h2 a:link, h2 a:visited {
    color: #A12600;
    text-decoration: none;
    }

h2 a:hover {
    color: #DF3500;
    text-decoration: none;
    }

h6 {
    padding: 0;
    margin: 0;
    font-size: 35px;
    float: right;
    text-align: right;
    color: #222;
    }

.btitle a:link, .btitle a:visited {
    padding: 0 25px 0 0;
    color: #FFA052;
    font-size: 30px;
    font-family: verdana;
    text-decoration: none;
    }

.stitle {
    padding: 0 10px 0 0;
    color: #FFFFFF;
    font-size: 12px;
    font-family: verdana;
    font-weight: bold;
    font-style: italic;
    }

.tinfo {
    color: #D4C082;
    font-size: 14px;
    font-family: verdana;
    text-transform: uppercase;
    border-bottom: #4E370F 1px solid;
    padding: 0 0 3px 0;
    }

/* Top Search */

#sform {
    padding: 10px 0 0 20px;
    margin: 0;
    }

#search input {
    width: 170px;
    font-size: 10px;
    color: #CCC;
    font-family: verdana;
    background:#1A1A1A;
    border: #414141 1px solid;
    }

#search input:focus {
    border:#2E2E2E 1px solid;
    }

#simage {
    background: url("images/s2.gif") no-repeat;
    width: 39px;
    height: 23px;
    }

/* Top Menu*/

#menu ul {
    list-style-type: none;
    margin: 80px 0 0 0;
    padding: 0;
    }

#menu ul li {
    display: inline;
    text-transform: lowercase;
    }

#menu ul li a {
    text-decoration: none;
    color: #494949;
    font-weight: bold;
    font-size: 13px;
    font-family: verdana;
    padding: 83px 13px 0 13px;
    font-weight: bold;
    }

#menu ul li a:hover {
    background: #000;
    -moz-opacity: 0.7;
    color: #FFF;
    border-bottom: #99280A 5px solid;
    text-decoration: none;
    background:
    }

/* Side Navigation */

.navigate {
    padding: 10px 0 30px 35px;
    font-size: 8px;
    font-family: verdana;
    }

.navigate ul {
    list-style-type: none;
    font-size: 11px;
    padding: 0;
    margin: 0;
    }

.navigate li a {
    background: url("images/arw.gif") no-repeat top left;
    text-decoration: none;
    display: block;
    color: #7F8062;
    border-bottom: #1F270B 1px solid;
    padding: 4px 0 4px 21px;
    margin: 0;
    }

* html .navigate li a {
    height: 13px;
    }

.navigate li a:hover {
    background: url("images/arw2.gif") no-repeat top left;
    text-decoration: none;
    color: #F7FABF;
    }

.navigate li li a {
    background: url("images/sub.gif") no-repeat top left;
    text-decoration: none;
    display: block;
    color: #7F8062;
    border-bottom: #1F270B 1px solid;
    padding: 4px 0 4px 41px;
    margin: 0;
    }

.navigate li li a:hover {
    background: url("images/sub2.gif") no-repeat top left;
    text-decoration: none;
    color: #F7FABF;
    }

/* Posts */

.info {
    background: #3A130A;
    -moz-border-radius: 10px;
    color: #FFFFFF;
    font-family: verdana;
    font-size: 5px;
    text-align: left;
    padding: 7px;
    margin: 15px 0 50px 0;
    }

.info a:link, .info a:visited {
    color: #FFFFFF;
    text-decoration: none;
    }

.comm, .comm a:link, .comm a:visited {
    color: #A5B968;
    font-weight: bold;
    text-decoration: none;
    }

.comm a:hover {
    color: #C7DC87;
    text-decoration: none;
    }

/* Footer Styles */

.credits {
    text-align: center;
    padding-top: 30px;
    color: #A1A1A1;
    font-size: 12px;
    }

#footer a:link, #footer a:visited {
    color: #A1A1A1;
    text-decoration: none;
    }

#footer a:hover {
    color: #E1E1E1;
    text-decoration: none;
    }

/* Miscellaneous */

img {
    border: 0;
    }

a:link, a:visited {
    color: #AAAF54;
    text-decoration: none;
    }

a:hover, a:active {
    color: #C3C963;
    }

blockquote {
    background: url("images/quote.gif") no-repeat top left;
    min-height: 90px;
    overflow: visible;
    color: #C3BCA5;
    margin: 0;
    padding: 15px 20px;
    }

code {
    font-family: monospace;
    color: #EFE4BE;
    }

pre {
    font-family: monospace;
    color: #C3BCA5;
    }

input, textarea {
    width: 98%;
    font-size: 11px;
    color: #CCC;
    font-family: verdana;
    background: #1A1A1A;
    border: #414141 1px solid;
    margin: 2px 0 0 0;
    }

textarea {
    padding: 3px;
    width: 96%;
    }

input:focus, textarea:focus {
    border: #2E2E2E 1px solid;
    }

#subc img {
    padding: 2px;
    border: #343434 5px solid;
    margin: 5px;
    }

#subc img:hover {
    border: #5C5C5C 5px solid;
    }

#subc img a {
    border: #343434 5px solid;
    }

small {
    color: #555;
    font-family: verdana;
    }

label {
    color: #555;
    font-size: 10px;
    }

table {
    font-family: verdana;
    font-size: 12px;
    border: #2E2E2E 1px solid;
    background: #131313;
    }

/* Post Specifications */

.hundred {
    display: block;
    text-align: center;
    margin: 0 0 10px 0;
    }

.alignright {
    float: right;
    }

.alignleft {
    float: left;
    }

.post-info {
    font-size: 10px;
    color: #DCDCDC;
    border: #2E2E2E 1px solid;
    margin: 10px;
    font-family: verdana;
    padding: 5px;
    }

.post-info a, .post-info a:visited, .comm-date a, .comm-date a:visited {
    color: #EABD52;
    }

.post-info a:hover {
    color: #F8BF3E
    }

.comment {
    padding: 10px 20px;
    }

.comm-entry {
    font-size: 11px;
    font-family: verdana;
    }

.s-entry {
    padding: 15px 0 0 15px;
    }

/* Links Page */

#linkpage input {
    width: 70px;
    }

#linkpage select {
    font-size: 11px;
    color: #CCC;
    font-family: verdana;
    background: #1A1A1A;
    border: #414141 1px solid;
    }

#linkpage ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    }

#linkpage li {
    padding: 10px 0;
    }

#linkpage p {
    margin: 0;
    padding: 0;
    }

/* Wp-Calendar */

#wp-calendar {
    width: 100%;
    font-size: 11px;
    font-weight: normal;
}

#wp-calendar #next a {
    padding-right: 10px;
    text-align: right;
}

#wp-calendar #prev a {
    padding-left: 10px;
    text-align: left;
}

#wp-calendar a {
    display: block;
    text-decoration: none;
}

#wp-calendar a:hover {
    text-decoration: underline;
}

#wp-calendar td {
    color: #7F8062;
    background: #1F1F1F;
    border: 1px solid #2E2E2E;
    margin: 0 4px 4px 0;
    padding: 2px;
    text-align: center;
    letter-spacing: normal;
}

#wp-calendar td:hover{
    background: #171717;
    border: 1px solid #292929;
}

#wp-calendar td.pad:hover {
    background: #171717;
    border: 1px solid #292929;
}

#wp-calendar #today {
    background: #333;
    border: 1px solid #222;
    border-width: 1px 0 0 1px;
    color: #FFF;
}

#wp-calendar th {
    background: transparent;
    border: 0;
    font-style: normal;
    text-transform: uppercase;
    text-align: center;
    padding: 2px;
    color: #999;
    font-weight: normal;
}

img.wp-smiley {
border: 0pt none;
margin: 0px;
padding: 0px;
vertical-align: middle;
}


My site : eSanctum

Regards
Dhanesh.
Go to the top of the page
 
+Quote Post
dhanesh
post Aug 5 2006, 04:04 PM
Post #2


Binary Geek
Group Icon

Group: Members
Posts: 444
Joined: 4-November 05
From: The Digital Arena
Member No.: 9,440
ok i wasent clear about what i actually wanted to do ..

1) I'd like to change the Font and Font Size of the blog posts that show on the main page. I think its the style.css i have to edit .. but what part of it should i change ?

2) The titles Categories .. Archives .. etc .. if i'd want to chance their Font and Font Size .. what do i change in style.css ..

3) The blog post titles and numbers that show .. i wanted to change the Font and Font Size of that too ...

4) The header links on top .. home .. about .. etc .. i wanted to change the color to something darker .. which line should i edit in style.css ?

5) And lastly .. i wanted to remove the "view related topic" drop down .. which files and code do i have to edit to take it off ..

Regards
Dhanesh.

EDIT : i would suggest you d'load the theme and check the style.css there so it wont be much of a confusion. smile.gif

This post has been edited by dhanesh: Aug 5 2006, 04:07 PM
Go to the top of the page
 
+Quote Post
pyost
post Aug 5 2006, 04:19 PM
Post #3


Nenad Bozidarevic
Group Icon

Group: [MODERATOR]
Posts: 1,013
Joined: 7-November 05
From: Belgrade, Serbia
Member No.: 9,500
Let's start at the beginning biggrin.gif This is what you have to do to edit a blog entry appearence (including the title).

For the post number, you should edit this part of the CSS:

CODE
.id {
    color: #686C24;
    padding-right: 3px;
    }



For the title:

CODE
h1, h1 a:link, h1 a:visited {
    color: #FFA303;
    font-size: 20px;
    font-family: verdana;
    text-transform: uppercase;
    font-weight: bold;
    padding: 0;
    margin: 7px 0 0 0;
    text-decoration: none;
    }



Just a note: by editing most of the attributes for h1, you will also affect the blog entry number, because it is nested between <h1> tags. Here's what I'm talking about:

CODE
<h1><span class="id">028</span><a href="http://www.esanctum.net/?p=28">College Shmollege ..</a></h1>



Next, the "posted by" part. It is nested between <h2> tags, so you have to edit the following code:

CODE
h2 a:link, h2 a:visited {
    color: #A12600;
    text-decoration: none;
    }

h2 a:hover {
    color: #DF3500;
    text-decoration: none;
    }



The first half defines how the poster link will look, and the other half how it will look when hovered over. If you wish to edit that whole line appearence (font size or font family), you have to add another part to the CSS file, which will look like this:

CODE
h2 {
    An attribute goes here
    An attribute goes here
    }



And finally, the text itself. I'm a bit confused about this one, since it uses a class called "entry", which doesn't exist in the CSS file. Maybe I'm missing something, but I'm no CSS guru. You can try to change that by editing the body tag:

CODE
body {
    font-family: verdana;
    font-size: 12px;
    color: #FFFFFF;
    text-align: center;
    background: #E1B26B url("images/bg.gif");
    margin: 0;
    padding: 0;
    }




Now let's switch to the sidebar. Since those titles ("Archives" etc.) are nested between <h4> tags, you should edit this part of the CSS:

CODE
h4 {
    background: url("images/sidebg.jpg") no-repeat bottom;
    width: 198px;
    height: 28px;
    text-transform: lowercase;
    margin: 0px;
    padding-right: 50px;
    color: #E5B655;
    font-size: 10px;
    text-align: right;
    font-family: verdana;
    }



For the menu at the top, I think this is the only part you should edit (first for normal state, second for hovering):

CODE
#menu ul li a {
    text-decoration: none;
    color: #494949;
    font-weight: bold;
    font-size: 13px;
    font-family: verdana;
    padding: 83px 13px 0 13px;
    font-weight: bold;
    }

#menu ul li a:hover {
    background: #000;
    -moz-opacity: 0.7;
    color: #FFF;
    border-bottom: #99280A 5px solid;
    text-decoration: none;
    background:
    }



As for the "View related topics" thing, where is it? I can't seem to find it, and therefore don't know how to remove it wink.gif

~edit~

OK, this should remove that annoying thing. Just delete this part of the code from your index.php file. The one that is a part of the theme, not the one in the root folder biggrin.gif

CODE
<div id="shelf">
               <div id="inf">
               <div class="clr">&nbsp;</div>
               <div id="com">
                <div class="tinfo">Commentors</div>
                <ul>
                   <?php get_tenrecentcomments(); ?>
                </ul>
               </div>
               <div id="ent">
                <div class="tinfo">Entries</div>
                <ul>
                   <?php query_posts('showposts=10');?>
                   <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
                   <li><span class="intr"><?php echo zeroise($post->ID, 3); ?></span><a href="<?php the_permalink() ?>"><?php the_title() ?></a></li>
                    <?php endwhile; endif; ?>
                </ul>
               </div>
               <div class="clr">&nbsp;</div>
              </div>
                        <br /><br />
            </div>


If the layout messes up, or something looks wrong, try by returning this line:

CODE
<div class="clr">&nbsp;</div>
Go to the top of the page
 
+Quote Post
dhanesh
post Aug 5 2006, 05:06 PM
Post #4


Binary Geek
Group Icon

Group: Members
Posts: 444
Joined: 4-November 05
From: The Digital Arena
Member No.: 9,440
Woooah .. that was elaborate smile.gif .. thankx for the quick reply there .. I still am stuck with how to edit the font .. but i did solve the annoying shelf thing you told at the end .. so its 1 down ..

I messed up in the code a little so i dunt know what i edited to get the font this small .. logically whatever i did i changed the size to 5px .. so i searched for anything with 5 px and the 2 things that came up were #content and body .. but after making them 10 .. they still wont change .. doint this .. also effected the sidebar titles :| lol .. gosh this is driving me nuts ..

Regards
Dhanesh.
Go to the top of the page
 
+Quote Post
« Next Oldest · WordPress · Next Newest »
 

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Wordpress 2(4)
  2. WordPress Theme Help Needed(0)
  3. Wordpress Url Display Problem(2)
  4. Wordpress: Google Adsense Referral Rotator Plug-in(7)
  5. Wordpress 2.0.6(8)
  6. Wordpress Widgets Drag/drop Bug ..(3)
  7. All New Wordpress Plug-ins & Widgets By M^e(0)
  8. How Do I Customize Wordpress(6)
  9. Tips For Modifying Wordpress Code(1)
  10. Best Wordpress Skin You Can Find.....(2)
  11. Afraid Of Updating My Wordpress(2)
  12. Twitter-like Wordpress Theme(0)


 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 13th October 2008 - 04:17 AM
Powered By IP.Board 2.2.1 © 2008  IPS, Inc.
Licensed to: Xisto Corporation