A Couple Little Issues

[HiroiSekai]

Hi there, I’m having a couple little issues popping up that I would love some clarification on.

1. In the link below, I have added a gallery of my own photos. However for some reason, the theme seems to be adding my featured image and banner image at the top of the article into the gallery without specification. I would like to prevent those images from showing up.

http://hiroi-sekai.com/2014/07/11/finally-back-the-conclusion-of-anime-expo-2014/

2. In general, the featured images in the Related section of each post are getting cropped within their own container divs. I can affect the container size itself through CSS, but I’d like just the images within the containers to show without cropping. Which CSS can make that work?

3. Although I apply the same layout through the Swift Page Builder for all of my posts, some posts start off with a larger gap between the banner image and the opening paragraph. Such examples are:

Normal spacing: http://hiroi-sekai.com/2014/07/23/that-figures-chuunibyou-demo-koi-ga-shitai-18-kyoto-animation-takanashi-rikka/

Extra gap: http://hiroi-sekai.com/2014/07/10/that-figures-ore-no-imouto-ga-konnani-kawaii-wake-ga-nai-18-kuroneko/

Where does that extra gap come from, and how do I prevent it from happening on some of my posts?

4. Revisiting this link: http://hiroi-sekai.com/2014/07/10/that-figures-ore-no-imouto-ga-konnani-kawaii-wake-ga-nai-18-kuroneko/

This is the one post so far that doesn’t show the featured image in the Masonry blog page even when I have it added. I have tried deleting, reuploading, reattaching and even deleting the post and restoring it, but nothing can make that featured image show up here: http://hiroi-sekai.com/blog/

What is going on with just that post?

Thank you very much.

[HiroiSekai]

Okay, I have solved 3 and 4 after hefty troubleshooting and testing. I would just like the answer to 1 and 2 at this point.

Thank you as always.

[Kyle – SUPPORT]

Hi

1) That’s odd, are you positive they’re not in your gallery?

2) Looks like you’ve added custom css to change the related section?

– Kyle

[HiroiSekai]

1) Positive. I checked numerous times, plus when I added a new banner image without touching the gallery, it added itself automatically for some reason.

2) The only custom CSS was because the theme’s related section was appearing together with WordPress’ default related section. Since I didn’t want both, I set a display:none on one of them. I’m just wondering why the images in the shown related section are cut off.

Thanks

[Kyle – SUPPORT]

1) Ok will forward this to the developer to check.

2) For the related posts, this isn’t the theme’s related posts section, and wordpress doesn’t include one by default so it must be a plugin you have installed.

Our related posts looks like this: http://cardinal.swiftideas.com/agency-demo/2014/03/27/hello-world/ (see bottom)

– Kyle

[HiroiSekai]

1. Thank you, hopefully it’s something that can be easily fixed.

2. Suppose I had it backwards. I moved the theme’s related section back. It seems the images are still a little too big and getting cut off; since all of my featured images are saved in the same resolution, is there a way to fill the related divs with the full image visible?

3. Just one new thing: I’m trying to add images back to my front page through the Swift Slider. Naturally, I design the backgrounds for desktop view, which works fine. The problem is when you view it in tablet/mobile view, where the image gets cut off on each end. I would also like to learn an effective method in keeping my caption with black background mobile-friendly.

Thanks as always!

[Kyle – SUPPORT]

2) You have no images set? (see screenshot)

3) With the swiftslider, the height stays the same, if you want it to reduce it height and width you will need to use the revolution slider

– Kyle

[HiroiSekai]

2) Yes, some are missing. If you refresh though, at least one image should eventually show up, and it’s cut off on all 4 sides. I’m wondering if there’s a way to prevent that from happening. I’d like the whole image to show up, since a lot of them have text as well.

3) Thank you, I’ll give that a shot.

[Kyle – SUPPORT]

Can you please set thumbnails for your posts because this is all I’m seeing (see screenshot)

– Kyle

Attachments:

You must be logged in to view attached files.

[HiroiSekai]

That’s strange, I have set images to most of them. Does this link have missing thumbnails too?

http://hiroi-sekai.com/2014/04/09/nintendo-rocks-new-smash-bros-nintendo-direct/

[Kyle – SUPPORT]

Are you using a child theme?

If so copy this to your functions.php file:

/* GET RECENT POST ITEM
    ================================================== */
    if ( ! function_exists( 'sf_get_recent_post_item' ) ) {
        function sf_get_recent_post_item( $post, $display_type = "bold", $excerpt_length = 20, $item_class = "" ) {

            $recent_post   = $recent_post_figure = $link_config = "";
            $thumb_type    = sf_get_post_meta( $post->ID, 'sf_thumbnail_type', true );
            $thumb_image   = rwmb_meta( 'sf_thumbnail_image', 'type=image&size=full' );
            $thumb_video   = sf_get_post_meta( $post->ID, 'sf_thumbnail_video_url', true );
            $thumb_gallery = rwmb_meta( 'sf_thumbnail_gallery', 'type=image&size=thumb-image' );

            foreach ( $thumb_image as $detail_image ) {
                $thumb_img_url = $detail_image['url'];
                break;
            }

            if ( ! $thumb_image ) {
                $thumb_image   = get_post_thumbnail_id();
                $thumb_img_url = wp_get_attachment_url( $thumb_image, 'full' );
            }

            // POST META
            global $sf_options;
            $single_author = $sf_options['single_author'];
            $remove_dates  = $sf_options['remove_dates'];
            
            $post_author    = get_the_author_link();
            $post_date      = get_the_date();
            $post_date_str  = strtotime( $post_date );
            $item_title     = get_the_title();
            $post_permalink = get_permalink();
            $post_comments  = get_comments_number();
            $custom_excerpt = sf_get_post_meta( $post->ID, 'sf_custom_excerpt', true );
            $post_excerpt   = '';
            if ( $custom_excerpt != '' ) {
                $post_excerpt = sf_custom_excerpt( $custom_excerpt, $excerpt_length );
            } else {
                $post_excerpt = sf_excerpt( $excerpt_length );
            }

            // MEDIA CONFIG
            $thumb_link_type          = sf_get_post_meta( $post->ID, 'sf_thumbnail_link_type', true );
            $thumb_link_url           = sf_get_post_meta( $post->ID, 'sf_thumbnail_link_url', true );
            $thumb_lightbox_thumb     = rwmb_meta( 'sf_thumbnail_image', 'type=image&size=large' );
            $thumb_lightbox_image     = rwmb_meta( 'sf_thumbnail_link_image', 'type=image&size=large' );
            $thumb_lightbox_video_url = sf_get_post_meta( $post->ID, 'sf_thumbnail_link_video_url', true );
            $thumb_lightbox_video_url = sf_get_embed_src( $thumb_lightbox_video_url );
            $thumb_lightbox_img_url   = wp_get_attachment_url( $thumb_lightbox_image, 'full' );

            // LINK CONFIG
            if ( $thumb_link_type == "link_to_url" ) {
                $link_config = 'href="' . $thumb_link_url . '" class="link-to-url"';
                $item_icon   = "ss-link";
            } else if ( $thumb_link_type == "link_to_url_nw" ) {
                $link_config = 'href="' . $thumb_link_url . '" class="link-to-url" target="_blank"';
                $item_icon   = "ss-link";
            } else if ( $thumb_link_type == "lightbox_thumb" ) {
                $link_config = 'href="' . $thumb_img_url . '" class="lightbox" data-rel="ilightbox[posts]"';
                $item_icon   = "ss-view";
            } else if ( $thumb_link_type == "lightbox_image" ) {
                $lightbox_image_url = '';
                foreach ( $thumb_lightbox_image as $image ) {
                    $lightbox_image_url = $image['full_url'];
                }
                $link_config = 'href="' . $lightbox_image_url . '" class="lightbox" data-rel="ilightbox[posts]"';
                $item_icon   = "ss-view";
            } else if ( $thumb_link_type == "lightbox_video" ) {
                $link_config = 'data-video="' . $thumb_lightbox_video_url . '" href="#" class="fw-video-link"';
                $item_icon   = "ss-video";
            } else {
                $link_config = 'href="' . $post_permalink . '" class="link-to-post"';
                $item_icon   = "ss-view";
            }

            if ( $thumb_type == "none" ) {
                $recent_post .= '<div itemscope class="recent-post no-thumb ' . $item_class . ' clearfix">';
            } else {
                $recent_post .= '<div itemscope class="recent-post has-thumb ' . $item_class . ' clearfix">';
            }

            $recent_post_figure .= '<figure class="animated-overlay overlay-alt">';
            
            $recent_post_figure .= apply_filters( 'sf_before_recent_post_thumb' , '');

            if ( $thumb_type == "video" ) {

                $video = sf_video_embed( $thumb_video, 400, 225 );
                $recent_post_figure .= '<div class="video-thumb">' . $video . '</div>';

            } else if ( $thumb_type == "slider" ) {

                $recent_post_figure .= '<div class="flexslider thumb-slider"><ul class="slides">';

                foreach ( $thumb_gallery as $image ) {
                    $alt = $image['alt'];
                    if ( ! $alt ) {
                        $alt = $image['title'];
                    }
                    $recent_post_figure .= "<li><a " . $link_config . "><img src='{$image['url']}' width='{$image['width']}' height='{$image['height']}' alt='{$alt}' /></a></li>";
                }

                $recent_post_figure .= '</ul></div>';

            } else {

                if ( $thumb_img_url == "" && $thumb_type != "none" ) {
                    $thumb_img_url = "default";
                }

                $image = sf_aq_resize( $thumb_img_url, 420, null, true, false );

                if ( $image ) {
                    $recent_post_figure .= '<img itemprop="image" src="' . $image[0] . '" width="' . $image[1] . '" height="' . $image[2] . '" alt="' . $item_title . '" />';
                    $recent_post_figure .= '<a ' . $link_config . '></a>';
                    $recent_post_figure .= '<div class="figcaption-wrap"></div>';
                    $recent_post_figure .= '<figcaption><div class="thumb-info thumb-info-alt">';
                    $recent_post_figure .= '<i class="' . $item_icon . '"></i>';
                    $recent_post_figure .= '</div></figcaption>';
                }
            }

            $recent_post_figure .= '</figure>';

            if ( $display_type == "bold" ) {

                $recent_post .= $recent_post_figure;
                $recent_post .= '<div class="details-wrap">';
                if ( $thumb_type == "none" ) {
                    $recent_post .= '<h2><a href="' . $post_permalink . '">' . $item_title . '</a></h2>';
                } else {
                    $recent_post .= '<h3><a href="' . $post_permalink . '">' . $item_title . '</a></h3>';
                }
                $recent_post .= sf_get_post_details($post->ID, true);
                $recent_post .= '</div>';

            } else if ( $display_type == "list" ) {

                $recent_post .= '<a class="list-post-link" href="' . $post_permalink . '"></a>';
                if ( $image ) {
                    $recent_post_figure .= '<figure class="animated-overlay">';
                    $recent_post_figure .= '<img itemprop="image" src="' . $image[0] . '" width="' . $image[1] . '" height="' . $image[2] . '" alt="' . $item_title . '" />';
                    $recent_post_figure .= '<a ' . $link_config . '></a>';
                    $recent_post_figure .= '<div class="figcaption-wrap"></div>';
                    $recent_post_figure .= '<figcaption><div class="thumb-info thumb-info-alt">';
                    $recent_post_figure .= '<i class="' . $item_icon . '"></i>';
                    $recent_post_figure .= '</div></figcaption>';
                    $recent_post_figure .= '</figure>';
                }
                $recent_post .= '<div class="details-wrap">';
                $recent_post .= '<h4>' . $item_title . '</h4>';
                $recent_post .= '<div class="post-item-details">';
                $recent_post .= '<span class="post-date">' . $post_date . '</span>';
                $recent_post .= '</div>';
                $recent_post .= '</div>';

            } else if ( $display_type == "bright" ) {

                $recent_post .= '<div class="details-wrap">';
                $recent_post .= '<div class="author-avatar">' . get_avatar( get_the_author_meta( 'ID' ), '140' ) . '</div>';
                $recent_post .= '<h6 class="post-item-author"><span class="author">' . sprintf( '<a href="%2$s" rel="author" itemprop="author">%1$s</a>', $post_author, get_author_posts_url( get_the_author_meta( 'ID' ) ) ) . '</span></h6>';
                $recent_post .= '<h2><a href="' . $post_permalink . '">' . $item_title . '</a></h2>';
                $recent_post .= '<div class="post-item-details">';
                $recent_post .= '<span class="post-date">' . $post_date . '</span>';
                $recent_post .= '</div>';
                $recent_post .= '</div>';
			
			} else if ( $display_type == "bold" ) {
			
                $recent_post .= $recent_post_figure;
                $recent_post .= '<div class="details-wrap">';
                if ( $thumb_type == "none" ) {
                    $recent_post .= '<h2><a href="' . $post_permalink . '">' . $item_title . '</a></h2>';
                } else {
                    $recent_post .= '<h3><a href="' . $post_permalink . '">' . $item_title . '</a></h3>';
                }
                $recent_post = sf_get_post_details($post->ID, true);
                $recent_post .= '</div>';
			                
            } else {

                $recent_post .= $recent_post_figure;
                $recent_post .= '<div class="details-wrap">';
                $recent_post .= '<h5><a href="' . $post_permalink . '">' . $item_title . '</a></h5>';
                $recent_post .= sf_get_post_details($post->ID, true);
                if ( $excerpt_length != "0" && $excerpt_length != "" ) {
                    $recent_post .= '<div class="excerpt">' . $post_excerpt . '</div>';
                }
                $recent_post .= '</div>';

            }

            $recent_post .= '</div>';

            return $recent_post;
        }
    }

– Kyle

[HiroiSekai]

Hey again,

I’m actually not using a child theme, just the standard Cardinal by itself.

[Kyle – SUPPORT]

In that case you’ll need to go to cardinal/swift-framework/content/sf-post-formats.php and change line 946:

$image = sf_aq_resize( $thumb_img_url, 420, 315, true, false );

to

$image = sf_aq_resize( $thumb_img_url, 420, null, true, false );

– Kyle

[HiroiSekai]

Brilliant, that worked perfectly. Many thanks!

Just need the final word on that strange issue with the extra included images in my gallery and everything will be peachy. Thanks again!

[Kyle – SUPPORT]

Oh yes of course, will forward to the developer for you

– Kyle