WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Moving a new sidebar from bottom to the right (34 posts)

  1. Emily99
    Member
    Posted 1 year ago #

    Hello,

    I am still learning CSS and I am trying to customise the Buttercream theme. I have created a new sidebar which I am trying to move from the bottom of the page to the right in line with the header. My site is:
    http://www.weekendbaking.co.uk/

    I am trying to create a similar sidebar to this site which also uses the buttercream theme: http://deliciouslyfictitious.com/

    I have looked through the forum for tips on how to change this, but I can't seem to change the position of the side bar.

    Any advice would be most welcome.

    Thanks,

    Emily

  2. I think you have an unclosed div tag somewhere.

    First, I'm unfamiliar with the "Buttercream" theme... but I am pretty sure those 4 widgets on the bottom are supposed to appear in the right (or left) sidebar, by default.

    I normally see widget areas that are supposed to be on one of the sides, shoot to the bottom, when there is improper html being used.

    Also, running your page through a validator (http://validator.w3.org), it seems your pages are encoded with UTF-7. I'm pretty sure you want this to be UTF-8.

    Hope this helps a little!

  3. Emily99
    Member
    Posted 1 year ago #

    Hi Josh,

    Thanks for responding so quickly. The theme deliberately has the widget area at the bottom, so I have created a fourth sidebar for the right side.

    I followed these instructions:http://wordpress.org/support/topic/theme-buttercream-anyone-care-to-share-how-to-create-a-sidebar?replies=15 (second post down) I think I have missed something when I get to style your sidebar in CSS. I can see the new sidebar in the widget area in the back-end.

    It maybe an unclosed div, I have tried to look. I copied the style css elements from another blog that had the right sidebar...although the position is still at the bottom.

    Do you need to see some of my css?

    Thanks for all your help.

    Emily

  4. Emily99
    Member
    Posted 1 year ago #

    Does anyone else have any suggestions?

    Thanks,

    Emily

  5. WPyogi
    Forum Moderator
    Posted 1 year ago #

    CSS is totally site and theme specific - so copying it from someplace else rarely works...

    But a bigger problem is that you need to be making these kinds of modifications in a child theme - otherwise your changes will be overwritten when the theme is updated - and you really don't want that to happen!

    http://codex.wordpress.org/Child_Themes

    Once you have that set up, we can work on the changes to make the sidebar work in a new template.

  6. Emily99
    Member
    Posted 1 year ago #

    I have followed the link instructions and added a child theme to the FTP with a copy of the style.css file. I have refreshed the WordPress admin site and checked to see in the child theme has pulled into the "edit themes" section of WordPress. I can't see it, should I?

    If you could help with the next step, I would be so grateful!

    Thanks so much,

    Emily

  7. WPyogi
    Forum Moderator
    Posted 1 year ago #

    You need to activate the child theme and the child theme style.css file should only have changes you've made to the CSS - not a copy of the whole file. You'll also need to move a copy of any template files you have changed to the child theme. And if you modified the functions file, you'll need to carefully read the child theme instructions as to how to put those changes in the child theme - it's a bit different for functions.php file.

  8. Emily99
    Member
    Posted 1 year ago #

    Ok I'll try now. Thank you

  9. Emily99
    Member
    Posted 1 year ago #

    I followed all the steps and just activated the child theme.

    Although I have just viewed my site and it says "HACKED BY FORCE EX" :-(

    Do you know how I can remove this?

    Thanks,

    Emily

  10. Emily99
    Member
    Posted 1 year ago #

    Other than the "Hackers" screen, I think the child theme worked.

  11. WPyogi
    Forum Moderator
    Posted 1 year ago #

    Seriously? Wow, that's not good :( . That looks like your site has been hacked - try deactivating your plugins and switching to the default theme just in case something else is going on.

  12. Emily99
    Member
    Posted 1 year ago #

    Yes everything is fine now for http://www.weekendbaking.co.uk. I returned to the default buttercream theme and deactivated the plugins.

    Last time I was hacked I changed the password in the PHPmyadmin (cPanel).

    Although, the hacker screen happens when I change themes, not sure why it's happening. Frustrating!

  13. Emily99
    Member
    Posted 1 year ago #

    I just tried to activate the child theme again and the "hackers" screen returns...

    :-(

  14. WPyogi
    Forum Moderator
    Posted 1 year ago #

  15. Emily99
    Member
    Posted 1 year ago #

    I removed the wordpress files from the FTP and re-installed again.

    I went through the steps to create a child theme again and activated. Then the "hacker" screen returned. It happens when I change to the child theme. I think I will have to create the right hand sidebar in the parent theme and just never update.

    It's so frustrating!!

  16. Emily99
    Member
    Posted 1 year ago #

    The hacked problem is now gone! But I need to re-build all my posts from scratch...I have taken word.doc downloads, so hopefully it won't take too long to put back together.

    I can now use a child theme...the only issue is that the parent theme structure is not pulling through. I want the child theme to make some small changes, which I have not yet added:

    * Right hand side bar
    * Navigation bar are the top rather than the bottom

    Everything else I would like the same. I have used this code in the Child css:

    /*
    Theme Name: Buttercream Child
    Theme URI: http://www.weekendbaking.co.uk/
    Description: Child theme for the Buttercream theme
    Author: xxxxxx
    Author URI: http://www.weekendbaking.co.uk/
    Template: buttercream
    */

    @import url("../buttercream/style.css");

    Should I add something else? I also have a functions.php with this code:

    <?php
    if ( ! function_exists( 'theme_special_nav' ) ) {
    function theme_special_nav() {
    // Do something.
    }
    }
    ?>

    Thanks,

    Emily

  17. WPyogi
    Forum Moderator
    Posted 1 year ago #

    That's great you got the hacked mess cleaned up - ugh! it looks like something isn't right with the child theme set up - right now, just put the style.css file in the child theme with nothing in it except the top section:

    /*
    Theme Name: Buttercream Child
    Theme URI: http://www.weekendbaking.co.uk/
    Description: Child theme for the Buttercream theme
    Author: xxxxxx
    Author URI: http://www.weekendbaking.co.uk/
    Template: buttercream
    */
    
    @import url("../buttercream/style.css");
  18. Emily99
    Member
    Posted 1 year ago #

    Just this bit?

    /*
    Theme Name: Buttercream Child
    Theme URI: http://www.weekendbaking.co.uk/
    Description: Child theme for the Buttercream theme
    Author: xxxxxx
    Author URI: http://www.weekendbaking.co.uk/
    Template: buttercream
    */

  19. WPyogi
    Forum Moderator
    Posted 1 year ago #

    You need the @import line too - that's what gets the parent theme styles.

  20. Emily99
    Member
    Posted 1 year ago #

    Yes that's all that is in the child theme.

    I have removed the functions.php.

    The wordpress themes (both parent and child) are sitting in the public_html and not in the WWW, does that matter?

  21. WPyogi
    Forum Moderator
    Posted 1 year ago #

    I really don't know - it's still not right - I'm wondering if your WP install is messed up. Can you switch back to the parent theme so we can see if that looks okay?

  22. Emily99
    Member
    Posted 1 year ago #

    Switched back...

    The parent theme looks fine on the live site.

  23. WPyogi
    Forum Moderator
    Posted 1 year ago #

    Well that's good anyway :). So is this the file structure you have?

    wp-content
       themes
          buttercream
          buttercreamchild
             style.css
  24. Emily99
    Member
    Posted 1 year ago #

    (/home/weekendb)

    public_html
    
     wp-admin
    
     wp-content
    
       plugins
    
       themes
    
          buttercream
    
     	img
    
            inc
    
            js
    
            languages
    
            layouts
    
            style.css
    
         buttercream child
            style.css
  25. Emily99
    Member
    Posted 1 year ago #

    So yes, the structure is as you've put it above.

  26. WPyogi
    Forum Moderator
    Posted 1 year ago #

    Is there a space in the name of the child - that sometimes causes problems. Try activating it again.

  27. Emily99
    Member
    Posted 1 year ago #

    I changed the child theme to "buttercream_child", but the same thing is happening to the styling of the page.

  28. WPyogi
    Forum Moderator
    Posted 1 year ago #

    No it actually looks okay!! Try clearing your browser cache.

  29. Emily99
    Member
    Posted 1 year ago #

    It's worked!!! Not sure what has changed, maybe the underscore "buttercream_child" theme just needed a couple more refreshes...the styling is now perfect.

    Thanks for your help!!!

    To make additional custom changes, I just write them after:
    @import url("../buttercream/style.css");

    I will try to follow the steps to create a right-hand side bar...very tricky.

  30. Emily99
    Member
    Posted 1 year ago #

    Can I just copy bits of code from the parent style css and then paste them into the child theme with the edits made? Is that correct?

Topic Closed

This topic has been closed to new replies.

About this Topic