Forums

[resolved] [Theme: Yoko] Sidebar Headache / Please Help (6 posts)

  1. lakotainc
    Member
    Posted 3 months ago #

    Hi guys, new user here, though I've had a bit of experience with WordPress themes before. I'm not exactly CSS savvy, though I usually feel my way through until I get the theme looking the way I want it to. A lot of google search on css queries gets me through, but this new theme I've installed (Yoko) is truly making my brain fry. I would usually abandon for another theme, but I quite like this ones look so thought maybe the support forum would be the place to go.

    As you probably know, Yoko is a three column design, a single content column, and two sidebars on the right. As has been discussed before on here, I wish to remove one of the sidebars (either really) and fill up the space that it took up with the single column. Have a look at psyche-interactive.com

    I've gone ahead and removed all instances of 'secondary' sidebar and it's connected code in a crude butcher type way in the theme's CSS stylesheet, and in the Sidebar.php. I've gone through every other php page and I can't figure out why the space where the sidebar used to be won't go away, it just remains there, looking all ugly and taking up space. If you change the window proportions, it contorts around the empty sidebar that isn't even being called anymore.

    I can't for the life of me figure this out, is it the initial table that is being called up? Or something like that? Just empty space. Here is my code.

    CSS Stylesheet

    [CSS code moderated - a link to your site is all that is needed]

    Sidebar:

    [code moderated - please use the pastebin.com]

    I can post any other code that you need, not sure what you'd be looking for. For me, looking through these pages is akin to reading a foreign language I only understand a little bit - words here and there. I'm probably just missing something that I don't understand.

    Your help would be greatly appreciated. I'm viewing the site through the newest crome browser, if that matters.

  2. lakotainc
    Member
    Posted 3 months ago #

    I've been continuing to try and fix this issue over the last two hours, I have come across many websites that have resolved the issue somehow. I've opened their CSS stylesheet and a lot have hidden the secondary sidebar, some have deleted the code entirely, but I can't access their sidebar.php to see the final step in the process.

    If anybody could please find a way to fix this for me, and those other users who have been trying to fix this (the forums search option yields a handfull of people who have asked the same query and never been answered.)

    One website that has solved it is: http://elschy.de/

  3. Looking at that last link you provided, I think to expand the width of the content and eliminate the middle column, just use some CSS.

    Also a little child theme functions.php file will clean up the Sidebar widget area.

    Create wp-content/themes/yoko-child/style.css and put in these lines:

    /*
    Theme Name: Yoko Child Theme
    Author: Self-Help WordPress User
    Template: yoko
    */
    
    @import url("../yoko/style.css");
    
    /* Start child theme CSS here */
    
    #content {
            width: 100%;
            float: left;
            margin-right: 4%
    }
    #secondary {
            display: none;
    }
    #tertiary {
            width: 21%;
            float: right;
            overflow: hidden;
    }

    I'm really pushing the code line limit here, so just in case here is the Pastebin link http://pastebin.com/DEEjJ6YU

    Now comes the fun part (which I understand better than CSS). Create a wp-content/themes/yoko-child/functions.php file and copy this into it.

    <?php
    
    add_action( 'init' , 'mh_unregister_sidebar' , 11 );
    
    function mh_unregister_sidebar() {
            unregister_sidebar( 'sidebar-1' );
            unregister_sidebar( 'sidebar-2' );
    
            register_sidebar( array (
                    'name' => __( 'Sidebar', 'yoko' ),
                    'id' => 'sidebar-2',
                    'description' => __( 'One Sidebar Only', 'yoko' ),
                    'before_widget' => '<aside id="%1$s" class="widget %2$s">',
                    'after_widget' => "</aside>",
                    'before_title' => '<h3 class="widget-title">',
                    'after_title' => '</h3>',
                    )
            );
    
    }

    And the Pastebin link for that is http://pastebin.com/gvBi7U7n

    The this removes the old sidebars and creates a new sidebar-2 with a different label and description.

    Technically, you can do without the functions.php file but you'd need to remember that Sidebar 1 never gets displayed. :)

  4. lakotainc
    Member
    Posted 3 months ago #

    Thanks so much for your clear response, I'm sure this will help many many people who have been searching for an answer. I've moved on to a different theme as I was growing weary and didn't think I'd get a reply (judging on past users who had the same problem, no slight against the community). Looking at what you've done there, I don't think I would have figured that out on my own.

    Thanks again ^_^

  5. bloginfonol
    Member
    Posted 3 months ago #

    Actually the above code works..But when the themes resizes itself for mobile devices..the sidebar doesn't look cramped..any suggestion for this ? Or I am the only one having this issue ?

  6. elschy
    Member
    Posted 2 months ago #

    My blog was already mentioned. So I decided to publish my yoko child theme. You can download my child theme under http://elschy.de/-child_yoko

    best regards
    elschy

Reply

You must log in to post.

About this Topic