Sidebar on News Archive

Home Forums Icelander Sidebar on News Archive

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #21480

    chadphilip
    Participant

    Sidebar on News Archive

    Resolved

    Hey there! Have you noticed this support service is provided FREE of charge?
    If you like the speed and accuracy of resolutions, please consider supporting me with a small donation. Thank you

    Consider a donation →

    Hello,

    We are using your theme for an video games accessibility website and are interested in activating the sidebar for the “News Archive” page. I am a programmer, but not so much for websites. If you could point me in the general direction on how to achieve this in the best way for the design of the theme then I should be able to figure the rest of it out on my own.

    I do know that the extra space on the right side of the News Archive page is currently used for optional details about the post: “Written by”, “Number of Comments”, etc. (The options that are enabled Appearance -> Customize -> Content Options.) We have these extra details turned off for our site.

    Any feedback would be appreciated.

    Thanks,
    Chad

    • This topic was modified 2 months, 2 weeks ago by  chadphilip.
    #21482

    Oliver Juhas
    Keymaster

    Hi Chad,

    First of all, thank you for using Icelander theme for such a beautiful website :)

    I can see you are using “Minimal” blog style (can be set in Appearance → Customize → Theme Options → Blog) and I’m sorry to inform you that minimal blog style does not support sidebar on blog archive page. (I should really mention this in theme docs, but it seems I forgot… sorry for inconvenience caused!)

    To be able to use a sidebar on blog archive page, please choose a different blog style. From what I can see on your website you are stripping all post meta in the blog list, so simple “List” blog style should be sufficient enough.

    If you want to restyle the blog appearance then, you can simply use your web browser code inspector to determine the custom CSS styles you need for your modifications, or reply to this ticket with specific details about the changes to blog appearance so I can help.

    Best regards,

    Oliver Juhas
    WebMan Design

    #21494

    chadphilip
    Participant

    Thank you.

    A couple of related questions…

    We are using the WooSidebars plugin for custom sidebars on some of our pages (https://docs.woocommerce.com/document/woosidebars-2/). When we apply a custom sidebar to the “News Archives” page it still uses the default sidebar. Is there a way to override this behavior?

    After switching to the “List” blog style, we noticed that the date and author information is presented before the snippet of article text on the “News Archive” page. We would prefer to have the snippet of text fill that entire space. This is something that I should be able to figure out, but I am noticing that WordPress seems to handle the “News Archive” page differently than other pages. Do you have a quick recommendation on how to achieve this?

    #21495

    Oliver Juhas
    Keymaster

    Hi chadphilip,

    As for WooSidebars it works perfectly fine for me. If it still doesn’t work for you, maybe try a different plugin. But I’d say the issue is in the custom sidebar configuration: as I presume you’ve set your “News Archive” page as a blog page, you should set your custom sidebar accordingly, to replace a sidebar on blog archive:

    To make the post excerpt fullwidth use this custom CSS:

    .posts-layout-list .type-post .entry-meta,
    .posts-layout-list .type-post .entry-content {
    	float: none;
    	width: auto;
    }
    
    .posts-layout-list .type-post .entry-meta {
    	margin-bottom: 1em;
    }

    (In case you really only want to target the blog archive page, just change .posts-layout-list to .blog.posts-layout-list.)

    Best regards,

    Oliver Juhas
    WebMan Design

    #21500

    chadphilip
    Participant

    I appreciate the help. I was able to get the code

    .posts-layout-list .type-post .entry-meta,
    .posts-layout-list .type-post .entry-content {
    	float: none;
    	width: auto;
    }
    
    .posts-layout-list .type-post .entry-meta {
    	margin-bottom: 1em;
    }

    to work when it was entered into the [Edit CSS] section, but not when added to the styles.css file for the child theme. (The child theme we are using was auto-generated by Icelander so there shouldn’t be any issues with it.)

    I did some searching on the Internet and my best guess is that the code in styles.css for the child theme isn’t being loaded… or its being loaded before the styles.css for the parent theme.

    Also when I change .posts-layout-list to .blog.posts-layout-list for just the archives page we are losing the desired layout. I also tried .blog .posts-layout-list but to no avail.

    Apologies for all the questions–I feel like I’m missing something obvious in both cases.

    • This reply was modified 2 months, 2 weeks ago by  Oliver Juhas. Reason: Making the post public as there is no sensitive information shared
    #21502

    Oliver Juhas
    Keymaster

    Hi chadphilip,

    I can see your child theme‘s style.css file being loaded correctly, after all theme stylesheets. You can check this yourself by displaying the page source code in your browser – right click on the page and select “View page source” (or similar, keyboard shortcut should be CTRL+U). So, once you put the CSS code into the file, there should be no issue at all. Maybe try to flush your browser cache (and server cache too if you use such solution).

    But you can use the native WordPress “Additional CSS” field of customizer too. It’s really up to you, what you prefer.

    Please note that I do not suggest using .blog.posts-layout-list as it really styles only the blog archive. All other archive pages will receive default posts list styles, so it will create inconsistency on your website. You can check the styling of any category archive on your website, for example.

    However, I’ve checked the .blog.posts-layout-list directly on your website and it works perfectly fine. Maybe try using your web browser code inspector to determine the CSS issues of your theme modifications if they are not working properly.

    Best regards,

    Oliver Juhas
    WebMan Design

    #21559

    chadphilip
    Participant

    Great, I appreciate the help. It was the browser cache that was causing the issue with the CSS code.

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

You must be logged in to reply to this topic.