Page 1 of 3 1 2 3 LastLast
Results 1 to 15 of 39

Thread: how to adjust this wordpress template

  1. #1
    Join Date
    Jul 2006
    Location
    LittlePenang.com
    Posts
    1,778
    Rep Power
    199

    how to adjust this wordpress template

    dear designer,

    i would like to use this template, but i ned to do some adjustment on the margin part, any one can assit me
    http://http://img338.imageshack.us/i...700x525dl8.jpg

    i would like to extent the width of part A and shorten the width of part C
    how can i adjust it?

    i am not so good in coding, simple coding or changes i can do, but i need advice where to look for this adjustment

    Regards
    calvynlee
    Last edited by calvynlee; 17-08-2007 at 11:44 PM.
    I blog IT Engineer LIFE at iCalvyn.com

    DreamNetwork If you don't mind Pirated

  2. #2
    Join Date
    Jun 2001
    Location
    Mystic Kingdoms
    Posts
    2,749
    Rep Power
    279
    there's no way except... doing css.

    check the css, which <div> for the A, B and C part.

    maybe you can paste the theme stylesheet.css here.

  3. #3
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    ya... you need the width and position is set in the CSS.. you need to find the div id of that 3 col and change it...

  4. #4
    Join Date
    Jul 2006
    Location
    LittlePenang.com
    Posts
    1,778
    Rep Power
    199
    guys...thank a lot, i never think before looking at CSS... i tought adjust at the index or sider.php, but cant find any width to chage at all...

    thank a lot. i will try to look my CSS... by the way, this is the CSS

    HTML Code:
    /*  
    Theme Name: Blog Oh Blog
    Theme URI: http://www.blogohblog.com/
    Description: This theme was designed and built by Bob of <a href="http://www.blogohblog.com/">Blog Oh Blog</a>. I love to hear of my work being used :). This work is licensed under a <a href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution 3.0 License</a>. This means you may use it for any purpose, and make any changes you like. Just leave my Bob link under your footer.
    Author: Bob
    Author URI: http://www.blogohblog.com/
    */
    
    body{font-family:Verdana, Arial, Helvetica, sans-serif;font-size:8pt;background-color:#50504f;background-image:url('images/gbck.gif');background-repeat:repeat}
    a:hover{text-decoration:underline;color:#666;border:none;}
    #box{width:970px;background:#fff;margin:20px auto;padding:10px;}
    #top{width:970px;background-color:#000;background-image:url('images/topbck.gif');background-repeat:repeat-x;height:51px;margin:0;padding:0}
    #header{float:left;width:400px;margin:0 0 0 10px;padding:0;}
    #header h1{text-indent:-10000px;margin:0;padding:0;}
    #header h1 a{display:block;background:url('images/logo.gif') no-repeat left;height:51px}
    #desc{color:#fdfdb0;float:right;width:400px;text-align:right;font-size:11px;margin:20px auto;padding:0 10px 0 0;}
    #jubow{background:#f3f2ed;height:30px;margin:10px auto;}
    #searchform{height:30px;line-height:30px;float:right;padding-top:5px;padding-right:5px;margin:0;}
    #searchform #s{font-size:8pt;width:230px;}
    #searchform #submit{font-size:8pt;}
    input#s{color:#666;border:1px solid #cbcbcb;background:#fcfcfc;}
    #nav{width:500px;height:30px;line-height:30px;float:left;padding:0;}
    ul.nav{height:30px;line-height:30px;float:left;list-style:none;font-size:12px;font-weight:700;text-transform:uppercase;margin:0;padding:0;}
    ul.nav li{float:left !important;list-style-type:none;margin:0;padding:0;}
    ul.nav li a, ul.nav li a:link, ul.nav li a:visited{border-bottom:0px none;border-left:0px none;background:#f3f2ed;color:#555;float:left;display:block;text-decoration:none;padding-left:10px; padding-right:10px; padding-top:0; padding-bottom:0}
    ul.nav li a:hover, ul.nav li a:active{background:#fff;color:#555;text-decoration:none;}
    ul.nav li.home a{border-left:2px solid #fff;text-decoration:none;}
    ul.nav li.current_page_item a{text-decoration:none;color:#555;background:#fff;}
    ul.nav li ul{float:left;margin:0;padding:0;}
    #bgbox{width:970px;background:url('images/cbck.gif') repeat-y;margin:0 auto;padding:0}
    .entry{width:510px;background:url('images/latestentry.gif') repeat-x;float:left;color:#666;text-align:justify;border:1px solid #e5e5bd;margin:5px auto;padding-left:6px; padding-right:6px; padding-top:5px; padding-bottom:10px}
    .entry img{border:4px #eee solid;}
    .entry2{width:510px;float:left;color:#666;text-align:justify;margin:5px auto;padding:5px 6px 10px;}
    .similiar{width:510px;float:left;color:#666;text-align:justify;border:#e5e5bd 1px solid;margin:5px auto;padding:5px 6px 10px;}
    #past, #divide{width:510px;float:left;text-transform:uppercase;font-weight:700;color:#666;padding:5px 6px 10px;}
    #sidebar{width:420px;float:right;font-size:11px;margin:5px;padding:0;}
    .navigation{width:510px;float:left;color:#666;padding:5px 6px 10px;}
    .alignright{float:right;margin-top:10px;}
    .alignleft{float:left;margin-top:10px;}
    .rsidebar{width:210px;float:right;color:#666;margin:0 auto;padding:0 10px 5px;}
    .rsidebar, .lsidebar img{border:none;}
    .lsidebar{width:160px;float:left;color:#666;margin:0 auto;padding:0 10px 5px;}
    #footer{width:960px;background:#6f7174;height:40px;line-height:40px;clear:both;color:#dadada;font-size:11px;margin:0;padding:0 0 0 10px;}
    .footer a:hover{text-decoration:none;color:#fff;border:none;}
    .footer p{margin:0;padding:0; line-height:40px;}
    .entry h2{font-family:Verdana, Arial, Helvetica, sans-serif;font-size:14px;font-weight:700;}
    .rsidebar h2, .lsidebar h2{font-size:13px;text-transform:uppercase;font-weight:700;border-bottom:#ccc 1px solid;border-top:#ccc 1px solid;margin:0 0 10px;padding:5px 0;}
    .rsidebar ul, .lsidebar ul{list-style-type:none;margin:0;padding:0;}
    .rsidebar ul li, .lsidebar ul li{list-style-type:none;margin:0 0 15px;padding:0;}
    .rsidebar ul li ul, .lsidebar ul li ul{list-style-type:square;margin:0;padding:0 0 0 5px;}
    .rsidebar ul li ul li, .lsidebar ul li ul li{list-style-type:none;background:url('images/b.gif') no-repeat 0 2px;border:0px none;margin-left:0; margin-right:0; margin-top:0; margin-bottom:1px; padding-left:15px; padding-right:0; padding-top:0; padding-bottom:0}
    .rsidebar p, .lsidebar p{padding:0 5px;}
    .postmeta{color:#666;border-bottom:#699 1px solid;}
    .boxcomments{border-top:5px solid #ddd;border-bottom:5px solid #ddd;margin-bottom:20px;width:510px;}
    #commentform{border-top:1px solid #eee;margin:0;padding:15px 15px 1px;}
    #commentform label{display:block;margin:0;}
    #commentform input{width:170px;margin:0 5px 10px 0;padding:1px;}
    #commentform textarea{width:400px;margin:0 0 10px;padding:0;}
    #commentform #submit{margin:0 0 20px;}
    #commentform p{margin:5px 0;}
    ol.commentlist{margin:0 0 1px;padding:0;}
    ol.commentlist :hover{background:url('images/latestbck.gif') repeat-x;}
    ol.commentlist li{border-top:1px solid #eee;display:block;list-style:none;margin:0;padding:15px 15px 1px;}
    ol.commentlist li :hover{background:none;}
    ol.commentlist li.commenthead{display:block;list-style:none;margin:0;padding:5px 15px;}
    ol.commentlist li.commenthead h2{margin:0;}
    ol.tblist{border-top:1px solid #fff;list-style:none;margin:0 0 1px;padding:15px;}
    ol.tblist li{display:block;background:url('images/c.gif') no-repeat 0 2px;padding-left:15px;list-style-type:none; margin-left:0; margin-right:0; margin-top:0; margin-bottom:5px}
    .footer a:link, .footer a:active, .footer a:visited{text-decoration:none;color:#f1e5aa;border:none;}
    a:link, a:active, a:visited, .postmeta a:hover{text-decoration:none;color:#666;border:none;border-bottom:#F90 dashed 1px;}
    .postmeta a:link, .postmeta a:active, .postmeta a:visited{text-decoration:underline;color:#660;border:none;}
    .postinfo img{border:none;}
    img.wp-smiley{border:0px none;padding:0}
    h1, h2, h3{font-size:14px;font-weight:700;color:#666;padding:0 10px 0 0;}
    #sidebar img, .lsidebar img{border:0px none;}
    input#url, input#author, input#email, textarea{color:#666;width:40%;border:1px solid #cbcbcb;margin-bottom:0.6em;background:#fcfcfc;margin-top:2px;padding:3px;}
    .entry h2 a:link, .entry h2 a:active, .entry h2 a:visited, #header h1 a:link, #header h1 a:active, #header h1 a:visited, #sidebar a:link, #sidebar a:active, #sidebar a:visited{text-decoration:none;color:#666;border:none;}
    #content{width:535px;float:left;line-height:140%;margin:5px auto;padding:0;}
    I blog IT Engineer LIFE at iCalvyn.com

    DreamNetwork If you don't mind Pirated

  5. #5
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    can you paste the index page code also.... Need to look for the css name that your index page column use...

  6. #6
    Join Date
    Jun 2001
    Location
    Mystic Kingdoms
    Posts
    2,749
    Rep Power
    279
    Code:
    .rsidebar{width:210px;float:right;color:#666;margin:0 auto;padding:0 10px 5px;}
    That's the size of right side bar.

    Code:
    .lsidebar{width:160px;float:left;color:#666;margin:0 auto;padding:0 10px 5px;}
    This the size of left side bar.

    But you need to change this first.
    Code:
    #sidebar{width:420px;float:right;font-size:11px;margin:5px;padding:0;}
    This one is for the 'A part'
    Code:
    #content{width:535px;float:left;line-height:140%;margin:5px auto;padding:0;}
    Change the value of the width.
    Beware of the padding px size. And the width of .class inside it.

    **IMPORTANT : Please save backup css. If broken.. replace bak the original one.
    Life and learn babeh..
    Last edited by mysticmind; 19-08-2007 at 01:10 PM.

  7. #7
    Join Date
    Jul 2006
    Location
    LittlePenang.com
    Posts
    1,778
    Rep Power
    199
    thank mystic, i will look into those section...

    freelancer, this is the index code

    HTML Code:
    <?php get_header(); ?>
    	<div id="content">
    
    	<?php if (have_posts()) : ?>
    
    		<?php while (have_posts()) : the_post(); ?>
    				<div class="entry">
    			<div class="post" id="post-<?php the_ID(); ?>">
    				<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
    				<small><abbr title="<?php the_time('Y-m-d\TH:i:sO'); ?>"><?php unset($previousday); printf(__('%1$s – %2$s'), the_date('', '', '', false), get_the_time()) ?></abbr> | by <?php the_author() ?></small>
    
    
    					<?php the_content('<br />Read the rest of this entry &raquo;'); ?>
    
    
    				<div class="postinfo"><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?> <img src="<?php bloginfo('template_directory'); ?>/images/cm.gif" alt="comment" /> | Posted in &raquo; <?php the_category(', ') ?> <?php edit_post_link('| Edit', '', ' | '); ?> </div>
    
    			</div>
    				</div>
    		<?php endwhile; ?>
    
    		<div class="navigation">
    			<div class="alignleft"><?php next_posts_link('&laquo; Previous Entries') ?></div>
    			<div class="alignright"><?php previous_posts_link('Next Entries &raquo;') ?></div>
    		</div>
    
    	<?php else : ?>
    
    		<h2>Not Found</h2>
    		<p>Sorry, but you are looking for something that isn't here.</p>
    
    
    	<?php endif; ?>
    
    	</div>
    
    <?php get_sidebar(); ?>
    
    <?php get_footer(); ?>
    I blog IT Engineer LIFE at iCalvyn.com

    DreamNetwork If you don't mind Pirated

  8. #8
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    bro mystic got the A part correct... i'm not so sure on the sidebar one coz it didn't show in your index page coding but i think mystic got it right also...

    to double check on the class name for sidebar, take a look inside the "get_sidebar()" function coding and look for the class name there.
    It should start with something like <div id="sidebar"> or <div id="rsidebar">.

  9. #9
    Join Date
    Jul 2006
    Location
    LittlePenang.com
    Posts
    1,778
    Rep Power
    199
    hey...
    i folo what mystic direction, i change the ..rsidebar width to 160px (decrease 50px) same as lsidebar. #sidebar width to 370px(previous 420px)

    the look currently at LittlePenang

    look like the content did not expend, and i change the the #content width:585px (increase 50px)

    still the same thing... DID I STILL MISS OUT ANYTHING???

    freelancer, FYI, this is the sidebar code
    HTML Code:
    <div id="sidebar">
    <?php include (TEMPLATEPATH . '/lsidebar.php'); ?>
    <?php include (TEMPLATEPATH . '/rsidebar.php'); ?>		
    </div>
    and the lsidebar
    HTML Code:
    <div class="lsidebar">
    <ul>
    	<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(1) ) : else : ?>
    
    
    			<?php wp_list_pages('title_li=<h2>Pages</h2>' ); ?>
    
    			<li><h2>Archives</h2>
    				<ul>
    				<?php wp_get_archives('type=monthly'); ?>
    				</ul>
    			</li>
    
    			<?php wp_list_categories('show_count=1&title_li=<h2>Categories</h2>'); ?>
    
    			<?php /* If this is the frontpage */ if ( is_home() || is_page() ) { ?>
    				<?php wp_list_bookmarks(); ?>
    
    				<li><h2>Meta</h2>
    				<ul>
    					<?php wp_register(); ?>
    					<li><?php wp_loginout(); ?></li>
    					<li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
    					<li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
    					<li><a href="http://wordpress.org/" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">WordPress</a></li>
    					<?php wp_meta(); ?>
    				</ul>
    				</li>
    			<?php } ?>
    	<?php endif; ?>
    	</ul>
    </div>
    and the rsidebar
    HTML Code:
    <div class="rsidebar">
    <ul>
    	<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar(2) ) : else : ?>	
    
        <li><h2>Recent Comments</h2>
    		
    				     <?php
        global $wpdb;
    
        $sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID,
        comment_post_ID, comment_author, comment_date_gmt, comment_approved,
        comment_type,comment_author_url,
        SUBSTRING(comment_content,1,30) AS com_excerpt
        FROM $wpdb->comments
        LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID =
        $wpdb->posts.ID)
        WHERE comment_approved = '1' AND comment_type = '' AND
        post_password = ''
        ORDER BY comment_date_gmt DESC
        LIMIT 10";
        $comments = $wpdb->get_results($sql);
    
        $output = $pre_HTML;
        $output .= "\n<ul>";
        foreach ($comments as $comment) {
    
        $output .= "\n<li>".strip_tags($comment->comment_author)
        .":" . "<a href=\"" . get_permalink($comment->ID) .
        "#comment-" . $comment->comment_ID . "\" title=\"on " .
        $comment->post_title . "\">" . strip_tags($comment->com_excerpt)
        ."</a></li>";
    
        }
        $output .= "\n</ul>";
        $output .= $post_HTML;
    
        echo $output;?>
    
    	
    			</li>
        <li><h2>Recent Post</h2>
    				<ul>
    
    <?php
    $myposts = get_posts('numberposts=10&offset=1');
    foreach($myposts as $post) :
    ?>
    <li><a href="<?php the_permalink(); ?>"><?php the_title();
    ?></a></li>
    <?php endforeach; ?>
    	
    		</ul>
    		</li>
        
    		<?php endif; ?>
    		</ul>
    </div>
    I blog IT Engineer LIFE at iCalvyn.com

    DreamNetwork If you don't mind Pirated

  10. #10
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    Quote Originally Posted by calvynlee View Post

    look like the content did not expend, and i change the the #content width:585px (increase 50px)

    still the same thing... DID I STILL MISS OUT ANYTHING???
    by looking at the sidebar both left and right... its exactly as bro mystic said.. if you have set the width correctly then it should be fine..

    for the content section try to increase .entry class width..


    .entry{width:510px;background:url('images/latestentry.gif') repeat-x;float:left;color:#666;text-align:justify;border:1px solid #e5e5bd;margin:5px auto;padding-left:6px; padding-right:6px; padding-top:5px; padding-bottom:10px}

    and

    .entry2{width:510px;float:left;color:#666;text-align:justify;margin:5px auto;padding:5px 6px 10px;}
    try to increase the red color widths as highligthed above in your css file and see whether it work or not....

    beforehand... as usual.. do backup first okie....

  11. #11
    Join Date
    Jul 2006
    Location
    Penang
    Posts
    1,781
    Rep Power
    10
    Looking at it now, it's pretty messed up.

    Calvyn, perhaps you can do the debugging/modification at your own PC (using xamplite), and get a 'refreshment CSS course' here:

  12. #12
    Join Date
    Jul 2006
    Location
    LittlePenang.com
    Posts
    1,778
    Rep Power
    199
    ffreelancer, i manage to change the .entry and the content are nice...

    now the problem is the vertical line btw 2 sidebar did not move and also the vertical bar btw the content and center sidebar also did not move. wer to move it?
    I blog IT Engineer LIFE at iCalvyn.com

    DreamNetwork If you don't mind Pirated

  13. #13
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    Quote Originally Posted by calvynlee View Post

    now the problem is the vertical line btw 2 sidebar did not move and also the vertical bar btw the content and center sidebar also did not move. wer to move it?
    i taken a look on it for half an hour now but still couldn't locate where the heck the vert line come from...this one is very tricky to spot... or maybe after few beers , i couldn't see properly .

    however, i suspect it might be a background image but couldn't confirm this one also..

    if it is ok with you, maybe you could zip up and email all the files in your wp theme folder for me to test it at my local pc. You can pm me for my email...
    Last edited by iamfreelancer; 21-08-2007 at 09:34 PM.

  14. #14
    Join Date
    Jun 2001
    Location
    Mystic Kingdoms
    Posts
    2,749
    Rep Power
    279
    imfreelancer ...
    YES! you're correct.

    it's a background image located here
    as the code mention it too..
    #bgbox{width:970px;background:url('images/cbck.gif') repeat-y;margin:0 auto;padding:0}
    need to redesign the image, replace the original one. Then should be ok.

  15. #15
    Join Date
    Sep 2005
    Location
    in my body lar...
    Posts
    1,325
    Rep Power
    0
    Quote Originally Posted by mysticmind View Post
    imfreelancer ...
    YES! you're correct.

    it's a background image located here
    as the code mention it too..


    need to redesign the image, replace the original one. Then should be ok.
    Gee... i taken a look on that image file before and didn't notice anything wrong with that cbk.gif file... d@mm.... its the beer fault... hahah...

    i think i have to apply "Don't Drink and Coding" lioa....

Page 1 of 3 1 2 3 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. Free WordPress Theme & Blogger Template
    By tmwwtw in forum Blogging Discussion
    Replies: 66
    Last Post: 27-02-2011, 07:43 PM
  2. Looking for similiar Wordpress template...
    By sfpkent in forum Blogging Discussion
    Replies: 1
    Last Post: 05-04-2009, 12:51 PM
  3. Free Wordpress Themes Template Collection from InternetWP.com
    By suraja in forum Blogging Discussion
    Replies: 0
    Last Post: 18-03-2009, 04:25 AM
  4. WTA: adjust on Wordpress date alignment
    By calvynlee in forum Website Programming
    Replies: 3
    Last Post: 13-12-2008, 02:42 PM
  5. Convert existing template to WordPress
    By fitz_heim in forum Looking To Hire
    Replies: 0
    Last Post: 23-04-2008, 07:46 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

SEO by vBSEO 3.5.0 RC1 PL1

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47