-
AuthorPosts
-
August 11, 2018 at 1:10 am #996191
I am trying to find anything recent on how to do this, but not able to get it to work
I cant even get it back to the default look, which is to small, but a step in the right direction.
On the Main Blog Posts page, i’d like a standard style blog listing
– Posts listed in Rows
Title & image on left, excerpt on Rightalso, if there is no featured image on the post, to have it display a set image or a nothing at all.
right now it shows a grey area with a pencil :(Here’s a mock up of what im going for,
http://prntscr.com/kh8kre- This topic was modified 6 years, 3 months ago by OhYa1337.
August 11, 2018 at 6:51 pm #996323Hey OhYa1337,
I took a look at your page and changed the sidebar settings to show a sidebar, for the small single author layout the sidebar must be enabled to show the image to the left of the post.
I also see that you added some custom css to make the images 280px square, but there was an error in the code that I corrected, so it is now working.
To remove the pencil icon and gray background color from the posts with no featured image, you could add this css to your Quick CSS:#top.page-id-344 .small-preview .iconfont { display: none !important; } #top.page-id-344 .main_color a.small-preview { background: transparent !important; }
If you would like to have a background image for the posts that have no featured image, try this css:
#top.page-id-344 .blog-meta a.small-preview { background: url(https://your-site.com/wp-content/uploads/2018/05/hero-blurred.jpg)center center no-repeat; background-size: cover; } #top.page-id-344 .small-preview .iconfont { display: none !important; }
just replace the image url with one you would like to use, or replace “your-site.com” with your domain to test with.
Best regards,
MikeAugust 11, 2018 at 11:06 pm #996353Thank you so much Mike, that’s exactly what I needed!
August 11, 2018 at 11:52 pm #996364Hi,
Glad to hear, unless there is anything else we can help with on this issue, shall we close this then?Best regards,
MikeAugust 12, 2018 at 12:07 am #996369How can I get the Categories to use that same Blog Layout?
They look totally different and have a tall grey bar if there is no image.
At Best,
I would like to make them look exactly the same as the main blog page
if not, at worst,
I need to at least put it on grid with no image previewAugust 12, 2018 at 1:30 am #996377Hi,
To change the archive pages to the single small layout, Try adding this code to the end of your functions.php file in Appearance > Editor://change category page layout to blog single small style add_filter('avf_blog_style','avia_change_category_blog_layout', 10, 2); function avia_change_category_blog_layout($layout, $context){ if($context == 'archive') $layout = 'single-small'; return $layout; }
then we will need to add the css style to the archive pages, Try adding this code to the end of your functions.php file in Appearance > Editor:
function archive_single_small_layout_css() { if ( is_archive()) { echo '<style> #top .blog-meta a.small-preview { background: url(https://your-site.com/wp-content/uploads/2018/05/hero-blurred.jpg)center center no-repeat; background-size: cover; } #top .small-preview .iconfont { display: none !important; } </style>'; } } add_action('wp_footer', 'archive_single_small_layout_css');
please change the url to suit.
Best regards,
MikeAugust 12, 2018 at 2:30 am #996384The first part doesn’t appear to have any effect.
the second one doesnt look like it replaced the grey bar with an image, but rather removed the image and left a empty spot there thats around 180px tall by maybe 50px wide – I would prefer it used the image at a set size (stretched wide format) or make it very small or removedAugust 12, 2018 at 3:09 am #996389Hi,
Strange, I don’t see link to your site anymore to see what you are referring to?Best regards,
MikeAugust 12, 2018 at 7:37 am #996411updated
August 12, 2018 at 5:31 pm #996463Hi,
Thank you for the login, I should explain that the “single small” layout with the image on the left of the article is only available when a sidebar is present, otherwise the image center aligns above the article. So for your blog page and archive (category) page a sidebar is active but hidden.
I saw that the image you choose to use for when a post has no featured image is a transparent white icon that doesn’t show without a background color, so I added light gray to your css, which you can change or remove if you wish.
This is the updated css in your Quick CSS:#top.archive .sidebar,#top.page-id-344 #main .sidebar { display: none !important; width: 0px !important; } #top.archive .sidebar_right .container .av-content-small.units,#top.page-id-344 .sidebar_right .container .av-content-small.units { width: 100% !important; } #top.archive .blog-meta a.small-preview,#top.page-id-344 .blog-meta a.small-preview { background: url(https://your-site.com/wp-content/uploads/2018/05/marker.png)center center no-repeat; background-size: cover; background-color: lightgrey; } #top.archive .small-preview .iconfont,#top.page-id-344 .small-preview .iconfont { display: none !important; }
Please clear your browser cache and check, and let us know if there are any other adjustments you would like.
Best regards,
Mike -
AuthorPosts
- You must be logged in to reply to this topic.