Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #221521

    Hi guys,

    First of all, thanks for your great theme. It’s a really cool and handy theme and we love it.
    I have a question regarding the layout though:

    We would like to make a news page where we will display posts with the category “News”. Right now, we’re using the advanced layout editor with the following settings:
    -blog style: grid layout
    -blog grid columns: 1
    -define blog grid layout: title and excerpt -preview image size: thumbnail(150×150) -post number: 20
    -pagination: yes
    It is working perfectly, however we would like the thumbnail displayed on the left and the title and excerpt on the right. Is there any way to fix this? or do i have to edit the css code? If so, please tell me which file, where and how to edit.

    Another question: is it possible to create a notification widget that tells you new post and custom post type updates in the same widget? It would be great if I could do that, but am I asking too much?

    Any help would be appreciated. Thanks in advance.

    Yeas

    #221590

    Hi Yeas!

    You can edit config-templatebuilder > avia-shortcodes > postslider.php, look for this code to modify the look of the blog grid layout:

     $markup = avia_markup_helper(array('context' => 'entry','echo'=>false));
    					$output .= "<article class='slide-entry flex_column {$style} {$post_class} {$grid} {$extraClass} {$thumb_class}' $markup>";
    					$output .= $thumbnail ? "<a href='{$link}' data-rel='slide-".avia_post_slider::$slide."' class='slide-image' title=''>{$thumbnail}</a>" : "";
    					$output .= "<div class='slide-content'>";
    
                        $markup = avia_markup_helper(array('context' => 'entry_title','echo'=>false));
                        $output .= '<header class="entry-content-header">';
                        $output .= !empty($title) ? "<h3 class='slide-entry-title entry-title' $markup><a href='{$link}' title='".esc_attr(strip_tags($title))."'>".$title."</a></h3>" : '';
                        $output .= '</header>';
    
                        if($show_meta && !empty($excerpt))
    					{
    						$output .= "<div class='slide-meta'>";
    						if ( $commentCount != "0" || comments_open($the_id) && $entry->post_type != 'portfolio')
    						{
    							$link_add = $commentCount === "0" ? "#respond" : "#comments";
    							$text_add = $commentCount === "1" ? __('Comment', 'avia_framework' ) : __('Comments', 'avia_framework' );
    
    							$output .= "<div class='slide-meta-comments'><a href='{$link}{$link_add}'>{$commentCount} {$text_add}</a></div><div class='slide-meta-del'>/</div>";
    						}
                            $markup = avia_markup_helper(array('context' => 'entry_time','echo'=>false));
    						$output .= "<time class='slide-meta-time updated' $markup>" .get_the_time(get_option('date_format'), $the_id)."</time>";
    						$output .= "</div>";
    					}
                        $markup = avia_markup_helper(array('context' => 'entry_content','echo'=>false));
    					$output .= !empty($excerpt) ? "<div class='slide-entry-excerpt entry-content' $markup>".$excerpt."</div>" : "";
    
                        $output .= "</div>";
                        $output .= '<footer class="entry-footer"></footer>';
    					$output .= "</article>";

    Or you can add something like this on Quick CSS or custom.css to align the grid image to the left:

    .slide-image {
    width: 30%;
    margin-right: 10px;
    float: left;
    }

    Regards,
    Ismael

    #221640

    Hi Ismael,

    Thanks for your help! Thats exactly what I wanted!
    However, I would like to have this layout only for some of my pages like my “News” page.
    With this css code:

    .slide-image {
    width: 30%;
    margin-right: 10px;
    float: left;
    }

    I get all of my blog pages displayed that way. (for example, for my “Tours” post page I wanna use the masonry option) Can you please tell me what selector(s) to add to this code?

    And again, I want to know if Enfold has a feature that tells you in one element the latest updates of posts and custom post types. Or is it something I have to deal with the plugins?

    Thanks for your support.

    Yeas

    #221699

    Hey!

    Please add following code to Quick CSS in Enfold theme options under Styling tab and change page ID to match your pages

    .page-id-999 .slide-image {
    width: 30%;
    margin-right: 10px;
    float: left;
    }

    You can right click on Chrome or Firefox and click Inspect elements to find the page ID

    Regards,
    Yigit

    #226123

    Hi Ismael,
    I would like to edit config-templatebuilder > avia-shortcodes > postslider.php
    I am using a child theme so I set up same path config-templatebuilder > avia-shortcodes > postslider.php and made the changes in the child theme postslider.php but it’s not working. Can’t see the changes in the front-end. It does show the changes when I modify postslider.php in the Enfold theme folder.
    What is going wrong?
    I appriciate your help.

    Ariane

    #227435

    Hi!

    If you want to load a custom shortcode file insert this code into the child theme functions.php:

    
    add_filter('avia_load_shortcodes', 'avia_include_shortcode_template', 15, 1);
    function avia_include_shortcode_template($paths)
    {
    	$template_url = get_stylesheet_directory();
        	array_unshift($paths, $template_url.'/shortcodes/');
    
    	return $paths;
    }
    

    and then create a “shortcodes” folder inside your child theme folder. Afterwards place your shortcode files (i.e. postslider.php) into the shortcodes folder.

    Cheers!
    Peter

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

You must be logged in to reply to this topic.