Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #272374

    Hello

    I purchased the Enfold theme yesterday and started to explore its features. I wanted to try and build a static homepage for my company, that also includes some blogposts from a specified category (say “news”). I used the “blog posts” shortcode from via the Avia Layout Builder. But the style of the shortcode changes if I use the template with or without the sidebar.

    When I use the template with the right sidebar, the featured picture of the blogpost is located to the left of the blog title and there is a dashed line below it. But when I use the template without the sidebar, the featured picture is above the blog title.

    I’d like to have the featured picture to the left, with the dashed line below, that connects it with the older post, but I don’t want to use the right sidebar.
    What I’d like to do, is to use the 3/4 column layout for the blogposts, put some additional information next to it and to use the full width of the boxed desing for other elements on the homepage. Is this possible? Thank you

    (I’d uploaded a picture to my development website as well: http://servis.3mh.sk/wp-content/uploads/2014/05/homepage-blog-shortcode.jpg , the credentials required to view the picture are included in the private content)

    #272579

    Hey!

    Open css/layout.css, comment/remove from line 1139 to line 1183:

    .fullsize .content{
    margin:0;
    border:none;
    }
    
    .fullsize .content .entry-content-wrapper{
    padding-right:0;
    }
    
    #top .fullsize .template-blog .post-title{text-align: center; font-size: 30px; padding:15px 0; max-width: 800px; margin: 0 auto;}
    #top.single-post .fullsize .template-blog .post_delimiter{visibility: hidden;}
    #top .fullsize .template-blog .post-meta-infos{text-align: center;}
    #top .fullsize .template-blog .post .entry-content-wrapper{text-align: justify; font-size:15px; line-height: 25px; max-width: 800px; margin:0 auto; overflow: visible; }
    #top .fullsize .template-blog .post .entry-content-wrapper > *{ max-width: 600px; margin-left:auto; margin-right:auto; }
    #top .fullsize .template-blog .post_delimiter{border-bottom-width:1px; border-bottom-style: solid; width:3000px; left:-1500px; position: relative; max-width: 3000px;}
    #top .fullsize .template-blog .post_author_timeline{display:none;}
    #top .fullsize .template-blog .blog-meta {
    float: none;
    margin: 0 auto;
    display: block;
    position: relative;
    width: 81px;
    overflow: hidden;
    text-align: center;
    z-index: 1000;
    }
    
    #top .fullsize .related_entries_container img{ margin: 0 auto;}
    #top .fullsize .related_title{text-align: center; }
    #top .fullsize .related_posts{ padding: 23px 0 33px 0; }
    
    #top .fullsize .template-blog .big-preview a ,#top .fullsize .template-blog .small-preview img{float:none; display: inline-block; width:100%; max-width: 100%;}
    #top .fullsize .template-blog .first-quote{margin-top:15px;}
    #top .fullsize .template-blog .big-preview.multi-big{margin-bottom:-48px; padding: 0; width:100%;}
    #top .fullsize .template-blog .big-preview.multi-big a, .fullsize div .template-blog .big-preview.multi-big a img{width:100%;}
    #top .fullsize .template-blog .big-preview img{width:100%}
    
    .fullsize .big-preview .avia-gallery {
    width: 600px;
    max-width: 100%;
    margin: 0 auto;
    }
    
    .fullsize .comment_content {padding-right:0;}
    .fullsize .blog-tags{display: block;}
    

    Regards,
    Josue

    #273155

    Thank you, it worked.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Styling of blog posts shortcode’ is closed to new replies.