Docs

[pixelvomit]

Hi,

I’m having some struggle in getting the blog post site to show my posts correctly and customising it a bit more.

On the page http://www.humanehuman.fi/stories (it’s set as my blog page) the text under the title doesn’t show line breaks. Is there any way of adding them?

And if I hover my mouse over the title or image it says “Permalink to: “postname””. Is there a way of changing this?

And lastly if I hover my mouse on top of the featured image there appears an icon. Where am I able to change this icon?

Thank you 🙂

[Friech]

Hi There,

Thanks for writing in! #1 Excerpt does not render styling (CSS) so we can only break those line with custom template, regretfully custom development is outside the scope of our support.

#2 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 that add the code below on your child theme’s functions.php file.

if ( ! function_exists( 'x_featured_image' ) ) :
  function x_featured_image( $cropped = '' ) {

    $stack     = x_get_stack();
    $fullwidth = ( in_array( 'x-full-width-active', get_body_class() ) ) ? true : false;

    if ( has_post_thumbnail() ) {

      if ( $cropped == 'cropped' ) {
        if ( $fullwidth ) {
          $thumb = get_the_post_thumbnail( NULL, 'entry-cropped-fullwidth', NULL );
        } else {
          $thumb = get_the_post_thumbnail( NULL, 'entry-cropped', NULL );
        }
      } else {
        if ( $fullwidth ) {
          $thumb = get_the_post_thumbnail( NULL, 'entry-fullwidth', NULL );
        } else {
          $thumb = get_the_post_thumbnail( NULL, 'entry', NULL );
        }
      }

      switch ( is_singular() ) {
        case true:
          printf( '<div class="entry-thumb">%s</div>', $thumb );
          break;
        case false:
          printf( '<a href="%1$s" class="entry-thumb" title="%2$s">%3$s</a>',
            esc_url( get_permalink() ),
            esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ),
            $thumb
          );
          break;
      }

    }

  }
endif;

Replace the string Permalink to: "%s" with your own.

#3 You can add this on your child theme’s style.css file

body .entry-thumb:before {
	content: "\f072";
}

The f072 is the unicode of the icon. Look for your icon unicode here: http://fontawesome.io/icons/

Cheers!

[pixelvomit]

Hey,

I got everything working, thank you very much for your help 🙂

[Christopher]

You’re welcome 🙂

[Author]

Posts