Navigation
This is archived content. Visit our new forum.
  • Author
    Posts
  • #633565
    LatinoMatters
    Participant

    Good evening,

    Is it possible to move the post title above the featured image on a blog post? I notice, too, that the default places it indents around 100 px to the right.

    Thanks for the help.

    #633582
    Rupok
    Member

    Hi there,

    Thanks for writing in! Right now, we don’t know which stack you are using and what’s the current setup as we have different stacks with various design. To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    #636106
    LatinoMatters
    Participant

    Sure thing.

    http://www.latinomatters.com

    I use the integrity stack.

    #636258
    Friech
    Moderator

    Hi There,

    Sorry, but would you mind providing us an URL of one of your blog post? I’ve tried https://www.latinomatters.com/blog but I cant find the link to your blog index page.

    Thanks!

    #636956
    LatinoMatters
    Participant

    Sure. Here is the url. You’ll see that the default title (which has been put in using wordpress not cornerstone) indents and is placed below the picture automatically.

    https://www.latinomatters.com/the-blog/

    Thank you.

    Here is the post link itself.

    https://www.latinomatters.com/2015/10/20/1236/

    Thanks.

    #637176
    Zeshan
    Member

    Hi there,

    Thanks for the URLs!

    The title can be moved before the image with template change. Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

    After that, copy the file wp-content/themes/x/framework/views/integrity/content.php in your child theme’s folder /framework/views/integrity/, open the copied file in a text editor and replace entire code with following:

    <?php
    
    // =============================================================================
    // VIEWS/INTEGRITY/CONTENT.PHP
    // -----------------------------------------------------------------------------
    // Standard post output for Integrity.
    // =============================================================================
    
    ?>
    
    <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
      <?php x_get_view( 'integrity', '_content', 'post-header' ); ?>
      <div class="entry-featured">
        <?php x_featured_image(); ?>
      </div>
      <div class="entry-wrap">
        <?php x_get_view( 'global', '_content' ); ?>
      </div>
      <?php x_get_view( 'integrity', '_content', 'post-footer' ); ?>
    </article>
    

    Then add following CSS code under Custom > CSS in the Customizer:

    .entry-header .entry-title {
        margin-bottom: 20px;
    }
    

    Hope this helps. 🙂

    Thank you!

    #637310
    LatinoMatters
    Participant

    OK. I watched the video, and it mentioned stack-specific child themes. When I downloaded it, though, there wasn’t any of those. Do I just use the x-child.zip?

    #637409
    Darshana
    Moderator

    Hi there,

    Sorry about the confusion. The new version of our Child Theme setup now only contain one folder which is the x-child. You need to place this folder inside your Root/wp-content/themes/ directory. Then Activate the new Child Theme as shown here (http://prntscr.com/663tb9) using your WordPress back-end (Appearance -> Themes).

    Hope that’s clear!

    #638015
    LatinoMatters
    Participant

    Thank you. That worked. I added a text element for the blog body, and when I reduce the screen size, the body text gets covered up. I looked to see if I had any margins or padding to the element but there are none.

    https://www.latinomatters.com/2015/10/20/1236/

    #638081
    LatinoMatters
    Participant

    Sorry to tack on things, but the date/author information isn’t displaying either.

    #638290
    Rue Nel
    Moderator

    Hello There,

    The date/author or the post meta is not showing because it is disabled. You can enable it in your customizer, Appearance > Customize > Blog > Content > Post Meta. Once enabled, you need to add the following css code in the customizer, Appearance > Customize > Custom > CSS to add some space between the post meta and the featured image.

    .entry-header {
        margin-bottom: 20px;
    }

    On this page, https://www.latinomatters.com/2015/10/20/1236/, your content has been pushed to the left because you added an inline css of margin-left: -100px;. You can find this inline css when you turn on the advance controls. Please remove this inline css to resolve the content getting pushed to the left. To minimize the spacing between the featured image and your content, you also have to make sure that you do not have any margin or padding in your section. By default, the section will have a top and bottom padding of 45 pixels. Please make sure that it is set to zero to minimize the gap between the image and your content.

    http://prntscr.com/8uzg8x

    You also need to add this custom css code in your customizer:

    .single-post .entry-wrap {
        padding-top: 0;
    }

    We would loved to know if this has work for you. Thank you.

    #638309
    LatinoMatters
    Participant
    This reply has been marked as private.
    #638340
    LatinoMatters
    Participant

    Everything else worked great. But as is, the body text still starts indented about 100px (that’s why I added it now that I remember). I’d like the body text to lineup with the title and featured image.

    #638438
    Lely
    Moderator

    Hello There,

    We’re glad that everything else is working fine now. Please also add the following CSS for the body text to line up with the title and image:

    .single .entry-wrap {
        padding: 0;
    }

    Hope this helps.

    #638826
    LatinoMatters
    Participant

    Thanks. I notice that the CSS:

    .single .entry-wrap {
    padding: 0;
    }

    only applies to the body text when added through WordPress not Cornerstone.
    Not a huge deal, but then I can’t use other Cornerstone elements like author box, etc.

    A couple more space questions:

    1. In Cornerstone, I can add “gap” to add space between sections, for instance, the bottom of the body text. Currently, the text ends right above the share buttons. Is there a way to add more padding to the bottom?

    2. Is there a way to modify or customize post meta information?

    3. Can the blog post’s font itself be customized without making a global change to the entire site’s body text?

    4. On this link: latinomatters.com/the-blog, the same indentation issue is happening, with the excerpt. I’d like to line it up with the image and title.

    Thanks again for all your help.

    Eric

  • <script> jQuery(function($){ $("#no-reply-633565 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>