WordPress.org

Ready to get started?Download WordPress

Forums

Can 'Classic' theme be customised? (10 posts)

  1. imack03
    Member
    Posted 4 years ago #

    I am using Classic WP on http://hyamsbeach.org/day/ and would like to change
    1. The graphic in the Header
    2. The sidebar headings to Bold or more noticable font.
    Thanks.

  2. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    1. for instance, you could add a background image to #header:

    #header {
    	background: #90a090 url(http://www.somewebsite.com/someimage.jpg) center top no-repeat;
    	border-bottom: 3px double #aba;
    	border-left: 1px solid #9a9;
    	border-right: 1px solid #565;
    	border-top: 1px solid #9a9;
    	font: italic normal 230% 'Times New Roman', Times, serif;
    	letter-spacing: 0.2em;
    	margin: 0;
    	padding: 15px 10px 15px 60px;
    }

    you might need to add a height to #header for this.

    2. in style.css: the headings are already 'bold', but you can change the color to darker #555 for instance, or add a font-size, or.....

    #menu ul {
    	color: #ccc;
    	font-weight: bold;
    font-size:1.2em;
    	list-style-type: none;
    	margin: 0;
    	padding-left: 3px;
    	text-transform: lowercase;
    }

    as the author of the classic theme says:

    Please tweak this and make it your own. :)

  3. imack03
    Member
    Posted 4 years ago #

    Thanks. The sidebar headings better. No luck with the Header but I need to tinker with this.

  4. Ginger Mayerson
    Member
    Posted 3 years ago #

    Can I add a left widgetized sidebar to the Classic theme?

    (And yes, I have looked at a lot of 3 column themes, but I really like the one I have. It just needs a left sidebar on the index and every other page in the blog.)

    Hi,

    I've been reading and tinkering and overwriting files for two days and I've run out of ideas. I was trying to follow the various instructions I found on the web, which seem so easy, and then just don't work because there's something crucial I don't understand. So here I am. Please help me.

    Here's my blog: http://wapshottpress.com/

    I have too many things on the right sidebar, but I need them, so I wanted to put a mirror of it on the left side of the page. This is probably very simple, but, sorry, I just can't figure it out on my own.

    I can make .php sidebar files, but here's what I need to know:

    1. What should I name the sidebar files? "sidebar1.php"? "sidebar2.php"? "sidebar-two.php"? "sidebar-two.php"? "sidebar-right.php"? "sidebar-left.php"?

    2, Exactly how do I edit the functions.php file? It looks like this right now:

    <?php
    /**
    * @package WordPress
    * @subpackage Classic_Theme
    */
    if ( function_exists('register_sidebar') )
    register_sidebar(array(
    'before_widget' => '<li id="%1$s" class="widget %2$s">',
    'after_widget' => '',
    'before_title' => '',
    'after_title' => '',
    ));

    ?>

    3. If I'm supposed to put "get sidebar" somewhere what are the exactly letters and symbols in that line of code? I have seen this, it seems right, but I don't know:

    <?php get_sidebar('left'); ?>
    <?php get_sidebar('right'); ?>

    4. And where would these or similar lines of code go in the index.php, or some other .php file? How can I get both sidebars on every page of the blog? And do I need to put a "div" somewhere? "div" confuses me a lot.

    5. Are there other theme .php files or the .css file I need to edit? And how would I do that?

    6. If we can get that left sidebar to happen, I'll worry about the header later.

    Thank you. If someone can point me to a baby-step by baby-step set of instructions, I'll try this on my own again. I really like using WordPress (I used Graymatter until I just couldn't use it anymore) but I've really slammed into the boundaries of my ability to figure things out with this issue. So any help on this would be much appreciated. If it's too much to do on the forum, I can provide my email if you contact me through the website. There's a contact form on the endless sidebar somewhere.

  5. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    before you consider expanding anything, try to fix your plethora of
    validation errors.

    make a backup copy of all theme files before editing anything
    the following needs a good basic knowledge of and respect for html, css, php.
    the left sidebar will be start below the header.

    1. naming is up to you, although the naming has to be consistent through out the theme (the following is using 'sidebar-2.php');

    2. in functions.php, add this after the existing code, but before ?> :

    if ( function_exists('register_sidebar') )
    	register_sidebar(array(
    		'name' => 'sidebar-2',
    		'before_widget' => '<li id="%1$s" class="widget %2$s">',
    		'after_widget' => '</li>',
    		'before_title' => '',
    		'after_title' => '',
    	));

    3. the code should look like: <?php get_sidebar('2'); ?>

    4. add this line <?php get_sidebar('2'); ?> after `get_header();
    ?>`

    (no extra divs were harmed in the making of this)

    5. make a copy of sidebar.php and save it as sidebar-2.php;
    - edit sidebar-2.php:
    change the following (add a 2 to menu, and a 2 into dynamic_sidebar(2) ):

    <div id="menu2">
    
    <ul>
    <?php 	/* Widgetized sidebar, if you have the plugin installed. */
    		if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(2) ) : ?>

    - obviously you have already edited functions.php;
    - edit style.css (the following styles are shown after edit):

    #content {
    	margin: 30px 13em 0 14em;
    	padding-right: 40px;
    }

    then make a copy of all styles starting with #menu - and add them back into style.css and change the starting to #menu2;
    change a few things in here:

    #menu2 {
    	background: #fff;
    	border-right: 1px dotted #ccc;
    	border-top: 3px solid #e0e6e0;
    	padding: 20px 10px 10px 20px;
    	position: absolute;
    	left: 2px;
    	top: 82px; /*this has to be changed to allow for your larger header image*/
    	width: 11em;
    }

    no guarantee that this is all, nor for typing errors. not tested in various browsers.

    make sure to keep your backup copies in a safe place to restore your theme if anything should go wrong.

  6. Ginger Mayerson
    Member
    Posted 3 years ago #

    Hi alchymyth,

    Thank you. I think we're very very close. I know we're much much closer than I was last night. Here's what the beastie looks like now in Firefox 3.6.3, Seamonkey 2.0.4, Navigator 9.0.0.6, and IE 8:

    http://wapshottpress.com

    I downloaded my Classic theme to my hard drive before I altered anything. Then, following your detailed and easy to understand instructions, I altered the files, added some widgets to Sidebar 2 and there is space for the left sidebar, but there seems to be nothing in it. So, maybe you could help me a little more on this. Sorry.

    Here's a temporary directory with the altered files in text format and my Widgets page in pdf (2 pdfs because of weird pdf pagination):

    http://wapshottpress.com/LeftSidebarProject051210/WapshottAlteredClassic051210/

    If you don't mind taking a look and telling me what I did wrong, I'd be much obliged. I'll take the directory down after I hear from you or in a day or two.

    Thanks again!

    PS. I'm looking at the Validation Errors. Some of these are plugins in can deactivate, if that would help in the left sidebar quest.

    PPS. I have Skype (ginger.mayerson) and can use Okeeno (okeeno.com) if that's helpful.

  7. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    did you add the code to index.php (point 4. - but my instructions were very unclear there)?

    the beginning of index.php should look now like this:

    <?php
    /**
     * @package WordPress
     * @subpackage Classic_Theme
     */
    get_header();
    ?>
    
    <?php get_sidebar('2'); ?>
    
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    i have the feeling this should be the missing piece,
    good luck.

  8. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    the #menu2 {} style needs to be adapted as posted in my earlier response; and the 'top:' value in this style should be adapted to the header height in your site und should be about 250px:

    here it is again:

    #menu2 {
    	background: #fff;
    	border-right: 1px dotted #ccc;
    	border-top: 3px solid #e0e6e0;
    	padding: 20px 10px 10px 20px;
    	position: absolute;
    	left: 2px;
    	top: 250px; /*this is changed to allow for your larger header image*/
    	width: 11em;
    }
  9. Ginger Mayerson
    Member
    Posted 3 years ago #

    Wheeeeeeeeee! alchymyth, you rule! http://wapshottpress.com Thank you so much! Are there any Wapshott books you'd like? I'd be happy to send you anything you'd like as a thank you. I'm so pleased with the wsy the pages look and it wouldn't have happened without your patience and clear step-by-step instructions. Thank you!

  10. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    you are welcome.
    thank you for your kind offer.

Topic Closed

This topic has been closed to new replies.

About this Topic