Call widget area before content in genesis_post_content?

Community Forums Forums General Discussion Call widget area before content in genesis_post_content?

This topic is: resolved

This topic contains 8 replies, has 2 voices, and was last updated by  rfmeier 1 year, 3 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #44247

    Ben @ Advice Media
    Participant
    Post count: 142

    I’m trying to add a widget area to the left of the content in the genesis_post_content hook area.

    I’ve already set a width for the content and padded it to the right so that the space is free for the widget.

    However, the widget area is being called after the content and so it is appearing at the bottom (see picture below).

    I want the widget area to be called first so that the widgets contained in it will appear in line with the top of the content just 20px below the main image.

    Any idea how to fix this? (Sorry, the site is on a localhost, so no link for the time being).

    I know this is going to be because I’m tired, it being nearly 2am and that I should really be in bed. But this is driving me up the wall and I’m determined to defeat it before going to sleep.


    #44250

    rfmeier
    Participant
    Post count: 597

    Hello,

    Since it is local to your development environment, I am gonna have to guess some possible culprits.

    Does the widget area have the appropriate css styling to float? It almost looks like the content has cleared both sides, forcing the widget down.

    Again, it’s hard to rule out css rules since I cannot debug the site.

    Let me know.


    #44251

    Ben @ Advice Media
    Participant
    Post count: 142

    Just in case it’s not 100 per cent obvious what I’m trying to achieve without being able to access the site, I’ve mocked up a screen in photoshop to demonstrate.

    Want to achieve

    As you can see, the widgets on the left have moved up to be inline with the top of the content under the featured image.

    As I said, any help will be much appreciated.


    #44253

    Ben @ Advice Media
    Participant
    Post count: 142

    Hi Ryan,

    I might upload it to my hosting tomorrow to make it easier to debug.

    In the meantime, it’s not a clearance issue. I’ll paste the relevant code below until I’ve uploaded the site tomorrow.

    From the functions file (for the call):
    `// Inserts advert spotbox into single posts
    add_action( ‘genesis_post_content’, ‘metro_advert_box’ );
    function metro_advert_box() {
    if (is_single() && is_active_sidebar( ‘in-post’ ) ) {
    echo ”;
    dynamic_sidebar( ‘in-post’ );
    echo ”;
    }
    }`

    And the CSS:

    `.entry-content p {
    clear: none;
    position: relative;
    font-size: 14px;
    font-size: 0.875rem;
    width: 53%;
    padding-left: 47%;
    right: 0;
    }`

    `.spotbox {
    width: 45%;
    float: left;
    margin: 0 0 15px 0;
    margin: 0 0 1rem 0;
    padding: 0;
    border: none;
    }

    .spotbox img {
    float: left;
    margin: 0 0 15px 0;
    margin: 0 0 1rem 0;
    padding: 0;
    border: none;
    }`


    #44255

    rfmeier
    Participant
    Post count: 597

    For giggles, have you tried removing the left padding on the .entry-content p?

    Just throwing ideas out.


    #44325

    Ben @ Advice Media
    Participant
    Post count: 142

    All that does is constrain the content within the boundaries of the width on the left rather than the right side of the genesis_post_content area like I need it to be.

    I’ve copied the CSS and functions pages over from the local host and pasted them as is into the same files on the server hosted version.

    This post is the only thing I’ve uploaded as it’s the only thing I’ve having an issue with at the moment.

    http://www.furfiemedia.co.uk/news/involuntary-it-managers-costing-small-businesses-in-productivity/

    Let me know if you need any other information or code.


    #44335

    rfmeier
    Participant
    Post count: 597

    Looking at this within chrome helped and I could edit css and move elements around.

    With the widget elements appearing before the entry content your css worked well, From your code you posted before, try this;

    [php]
    // Inserts advert spotbox into single posts
    add_action( ‘genesis_post_content’, ‘metro_advert_box’, 9 ); // set priority less than 10
    function metro_advert_box() {
    if (is_single() && is_active_sidebar( ‘in-post’ ) ) {
    echo ”;
    dynamic_sidebar( ‘in-post’ );
    echo ”;
    }
    }[/php]

    I set the priority to 9. This will execute your code before the default Genesis callbacks.

    Hope this helps.


    #44626

    Ben @ Advice Media
    Participant
    Post count: 142

    Thank Ryan,

    I had a feeling it was going to be a case of setting a priority level.

    Just for reference – in case anyone else is interested – once I put that code into, I needed to create css for each of the div ids.

    I used the information from the .spotbox classes, and simply added clear: both; to each of the new ids.

    That sorted it all out now.

    For example, in the advert box – which is a text widget, the css is now:

    `#text-5 {
    width: 45%;
    clear: both;
    float: left;
    margin: 0 0 15px 0;
    margin: 0 0 1rem 0;
    padding: 0;
    border: none;
    }`


    #44649

    rfmeier
    Participant
    Post count: 597

    Good to hear it worked. I am glad I could help.


Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.