Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #1186688

    Hello,

    I would like to add a “al our categories” image-boxes at the bottom of my posts.

    This is what I would like to achieve on desktop https://www.screencast.com/t/eKcgu61b9Xte (website example https://www.londradavivere.com/)
    This is what I would like to achieve on mobile https://www.screencast.com/t/X3k3aDQOFojN (website example https://www.londradavivere.com/)

    Also, I would like to achieve this on the archive category page https://www.screencast.com/t/huto8iQt >>>> picture, title, date and name of the author (website example on https://www.londradavivere.com/consigli-utili/)

    Thank you guys for your help.

    Marco

    #1187672

    Hi guys, just touching base to see if you read my ticket. 😀

    #1187733

    Hi marcoabis81,

    Well, you can use masonry with the relevant post category selected to be shown.

    As for the archive pages, here is how to change their layout:
    https://kriesi.at/support/topic/category-archive-page-change-layout-to-show-excerpt/#post-459206

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #1188696

    Hi Victoria,
    1) masonry, I will test it again.
    2) archive page, I had already read the post you indicated but I cannot manage to get the same. https://www.screencast.com/t/huto8iQt This is how I would like to get the archive posts

      Featured pic (horizontal)
      Post title
      Breadcrumb

    3) About the categories, how can I show all the categories at the bottom of every post? You know the feature “you may be interested” >>> this is about posts a visitor may want to read. But I would like also to show all the categories at the bottom of each post. Maybe with a plugin? Any suggestion?

    regards,
    Marco

    #1189075

    Hi Marco,

    You can look at the related posts plugins here:
    https://blog.hubspot.com/website/best-wordpress-related-post-plugins

    You can try the ‘blog-grid’ layout for the archive page. If it does not work for you, you’ll have to customize the archive.php file.

    Best regards,
    Victoria

    #1189086

    Hi Victoria,
    please, could you help me a little more?

    I wrote 4 points.

    The 1st one is ok, I will test it.

    The 2nd one, to which you answered, is not easy at all, in fact I wrote I have already changed the PHP file and the result is quite awful.

    3) 3) About the categories, how can I show all the categories at the bottom of every post? You know the feature “you may be interested” >>> this is about posts a visitor may want to read. But I would like also to show all the categories at the bottom of each post. Maybe with a plugin? Any suggestion?

    thanks
    Marco

    #1190357

    Hi,

    2.) Did you change the Blog Layout to Grid Layout? You can find the setting in the Enfold > Blog Layout panel. Or use this snippet in the functions.php file to adjust the style of the archive pages.

    
    function avia_change_category_blog_layout($layout, $context){
        if($context == 'archive') $layout = 'blog-grid';
        return $layout;
    }
    add_filter('avf_blog_style','avia_change_category_blog_layout', 10, 2); 
    

    3.) Are you using the default editor for your posts? If you are, then you have to modify the single.php file to display the categories below the content or below the related posts section. In the file, look for this code:

    //show related posts based on tags if there are any
    	                        get_template_part( 'includes/related-posts');
    

    Below, you can add the function to get the available categories.

    // https://developer.wordpress.org/reference/functions/get_categories/#user-contributed-notes

    Best regards,
    Ismael

    #1190440

    Hi Ismael,
    thank you :-)

    2)
    I have tried it but the result is the grid layout which is not what I want.
    function avia_change_category_blog_layout($layout, $context){
    if($context == ‘archive’) $layout = ‘blog-grid’;
    return $layout;
    }
    add_filter(‘avf_blog_style’,’avia_change_category_blog_layout’, 10, 2);
    ——————————————————————————————————————————————————————————–

    I am using the advanced editor layout on archive pages, this is what I get at the moment (I have hidden some PHO code I was given earlier)
    https://www.screencast.com/t/JpYgnpAQ This is a god layout but I would like to hide completely the content of the post

    3)
    I tried this solution and I have obtained a new copy of related post and categories below the footer :-(

    I think this is not what a ws looking for. To be nice, this should stay just below the already existing related posts. I am leaving the code in the single post php in case you want to give it a look.

    Also, I would like the category list to have a grid layout.

    Not sure if this all is possible, you eventually let me know please Ismael :-)

    thanks,
    Marco

    #1191196

    Hi Ismael,

    I am still working on the display of the posts in the archives :-)
    I think I have found a solution.

    Could you please tell me how I can hide all the post content from this page? By doing this I will have for each post TITLE + line with number of the comments and the image.

    https://www.ninserviziogratuito.co.uk/categoria/alloggio
    2020-03-08_0018

    Thanks :-)
    Marco

    #1191402

    Hi,

    2.) Based on the screenshot, looked like you wanted a grid layout for the archive pages, but apparently not. If you want to remove the post meta info from the post item and leave the title, use this css code.

    .post-meta-infos {
    	display: none;
    }

    3.) Did you use the code sample provided in the documentation? That should loop through the available categories.

    // https://developer.wordpress.org/reference/functions/get_categories/#user-contributed-notes

    Best regards,
    Ismael

    #1191495

    Hi Ismael,
    thank you for answering.
    No, Not this way, with this CSS we hide the meta info but I want to keep it.

    So basically I would like to hide only the post content and keep: Meta info, title of the post and main pic.

    Thanks,
    Marco

    #1192115

    Hi,

    You can use this one instead if you want to hide the content of the items in the archive pages.

    .archive .entry-content {
    	display: none;
    }

    This will also affect the images added in the content editor, so make sure that the featured image of the post is set.

    Best regards,
    Ismael

    #1192274

    Hi Ismael,
    Thanks for the code. I see, the featured image has gone, how do I restore it?

    You say:

    make sure that the featured image of the post is set

    Thanks;
    Marco

    #1192443

    Hi,

    Did you modify the loop-index.php file? Looks like it has been removed manually from the template. Please get a fresh copy of the loop-index.php file and do the modification again without removing the featured image.

    Best regards,
    Ismael

    #1192456

    Hi Ismael,

    Yes, I had done a modification on the loop-index file, it was needed to amend the “updated post” from English to Italian to appear above to the meta info of a post.
    I was given this code by Nikko
    2020-03-11_2315

    What do you mean that the file was manually removed from the template? You mean from Enfold? If this is the case, it means that instead of copying the file from Enfold to the child theme, I moved it by mistake, my bad. It is mandatory that I put back this file in Enfold? Or with the next update of Enfold this will be re-added automatically?

    I believe this is the code that hides the featured image
    .post-entry .big-preview {
    display: none !important;
    }

    I need this code in order to hide this https://www.screencast.com/t/7zNbNBMJ

    How can I keep hiding the featured image but appearing ni the archive?

    Thank you,
    Marco

    #1193390

    Hi,

    I believe this is the code that hides the featured image

    Sorry for the late response. Try to replace the modification with the following css code to keep the featured image in the archive page.

    .single .post-entry .big-preview {
        display: none !important;
    }
    

    Best regards,
    Ismael

    #1193579

    Hi Ismael,
    thank you for your answer.

    I have replaced the code but the featured image does not display on archive page.

    I tried to do this:
    If with this CSS

    .post-entry .big-preview {
    display: none !important;
    }

    and this other

    .single .post-entry .big-preview {
        display: none !important;
    }

    obtain the same result of hiding the featured image on a post and with this other CSS we hide the content in the archive page

    .archive .entry-content {
    	display: none;
    }

    we might use a code that instead tells to SHOW the feature page in the archive page so I tried the following with no success.
    2020-03-16_1717

    What do you think?

    Bests,
    Marco
    `

    #1195101

    Hi,
    To show the feature image on an archive page please try this css:

    #top.archive .entry-content {
    	display: block !important; 
    }

    Best regards,
    Mike

    #1195106

    Hi Mike,
    thank you for answering.

    This is what I want to achieve:
    1) hide featured picture in each post (achieved with the following code)

    .post-entry .big-preview { 
        display: none !important; 
    }

    2) hide all the text of the post on the ARCHIVE PAGES (achieved with the following code)

    .post-entry .big-preview { 
        display: none !important; 
    }

    3) TO BE ACHIEVED YET
    to show the featured picture in the ARCHIVE ONLY. Not on blog post – hidden on point 1.

    That is why I thought that we may use a code which says “show featured picture in the archive post”
    2020-03-21_1532

    Thanks,
    Marco

    #1195214

    Hi,
    Thank you for explaining, your first css is correct for hiding the “feature image” on regular posts big-preview
    But your archive posts don’t use the big-preview layout.
    So the css you are using to hide the excerpts on the archive posts is also hiding the feature image:

    .archive .entry-content {
        display: none;
    }

    because the image is inside of entry-content
    So to hide the content and show the feature image on the archive posts you could replace the above css with this:

    #top.archive #wrap_all #main .entry-content p,#top.archive #wrap_all #main .entry-content h2,#top.archive #wrap_all #main .entry-content > div:not(.avia-image-container),#top.archive #wrap_all #main .entry-content ul,#top.archive #wrap_all #main .entry-content h3,#top.archive #wrap_all #main .entry-content h6 {
        display: none;
    }

    But this is not the best because we have to guess what elements are going to be in the entry-content such as “p”, “h2”, “h3”, etc.
    Instead, I recommend moving the image before the entry-content so it won’t be hidden and you can target the content easily with entry-content.
    Try adding this code to the end of your functions.php file in Appearance > Editor:

    function custom_image_script(){
      ?>
      <script>
    (function($){
      $(window).load(function(){
      $( '#top.archive #wrap_all #main .post-entry' ).each(function() {
      $( this ).find( '.avia-image-container' ).insertBefore( $(this).find('.entry-content'));
      });
      });
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'custom_image_script');

    So with this function you can leave your current css as is.

    Best regards,
    Mike

    #1195223

    Hi Mike,
    You are right, it worked.

    Not sure what you meant by “moving” the picture but the PHP code worked. I kept the CSS code and just added the PHP code and now the archives are showing the pic :-)

    Perfect. I believe the structure of my site (expect a little few things I will be doing) is quite done :-)

    I could not do that without your help guys :-)

    Appreciated

    Marco

    #1195261

    Hi,
    Glad we could help, shall we close this then?

    Best regards,
    Mike

    #1195264

    Hi Mike,
    yes please, you can close the ticket.

    Thank you :-)
    Marco

    #1195268

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

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

The topic ‘Category boxes with images bottom of post’ is closed to new replies.