New Landing How can we help? Cardinal How do I change the height of the portfolio photo?

Viewing 9 posts - 1 through 9 (of 9 total)
  • Posted in: Cardinal
  • #174947
    hotspring
    Member
    Post count: 85

    I would like to make the height of the portfolio photo taller to make square shape.

    Thanks,

    #174965
    Nishant – SUPPORT
    Spectator
    Post count: 649

    Hello hotspring,

    To make your images appear square, you need to resize your images to equal width and height.

    Then, all the images will appear in square shape. Currently, your images dont have equal width and height so they are not looking squared.

    #175134
    hotspring
    Member
    Post count: 85
    This reply has been marked as private.
    #175136
    hotspring
    Member
    Post count: 85
    This reply has been marked as private.
    #175158
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Hi

    It’s because you’re using the portfolio post type instead of the team post type. To change to sqaures you’ll need to add this to your child theme’s functions.php file and change the widths and heights to be equal:

    /* PORTFOLIO THUMBNAIL
        ================================================== */
        if ( ! function_exists( 'sf_portfolio_thumbnail' ) ) {
            function sf_portfolio_thumbnail( $display_type = "gallery", $multi_size = "", $multi_size_ratio = "1/1", $columns = "2", $hover_show_excerpt = "no", $excerpt_length = 20, $gutters = "yes", $fullwidth = "no" ) {
    
                global $post, $sf_options;
    
                $portfolio_thumb = $thumb_image_id = $thumb_image = $thumb_gallery = $video = $item_class = $link_config = $port_hover_style = $port_hover_text_style = '';
                $thumb_width     = 400;
                $thumb_height    = 300;
                $video_height    = 300;
    
                if ( $columns == "1" ) {
                    $thumb_width  = 1200;
                    $thumb_height = 900;
                    $video_height = 900;
                } else if ( $columns == "2" ) {
                    $thumb_width  = 800;
                    $thumb_height = 600;
                    $video_height = 600;
                } else if ( $columns == "3" || $columns == "4" ) {
                    if ( $fullwidth == "yes" ) {
                        $thumb_width  = 500;
                        $thumb_height = 375;
                        $video_height = 375;
                    } else {
                        $thumb_width  = 400;
                        $thumb_height = 300;
                        $video_height = 300;
                    }
                }
    
                if ( $display_type == "multi-size-masonry" ) {
                    if ( $multi_size_ratio == "4/3" ) {
                        if ( $multi_size == "wide-tall" ) {
                            $thumb_width  = 1000;
                            $thumb_height = 750;
                        } else if ( $multi_size == "tall" ) {
                            $thumb_width  = 500;
                            $thumb_height = 750;
                        } else if ( $multi_size == "wide" ) {
                            $thumb_width  = 1000;
                            $thumb_height = 375;
                        } else if ( $multi_size == "standard" ) {
                            $thumb_width  = 500;
                            $thumb_height = 375;
                            $video_height = 375;
                        }
                    } else {
                        if ( $multi_size == "wide-tall" ) {
                            $thumb_width  = 900;
                            $thumb_height = 900;
                        } else if ( $multi_size == "tall" ) {
                            $thumb_width  = 450;
                            $thumb_height = 900;
                        } else if ( $multi_size == "wide" ) {
                            $thumb_width  = 900;
                            $thumb_height = 450;
                        } else if ( $multi_size == "standard" ) {
                            $thumb_width  = 450;
                            $thumb_height = 450;
                            $video_height = 450;
                        }
                    }
    
                    if ( $gutters == "yes" && $multi_size == "tall" ) {
                        $thumb_height = $thumb_height + 50;
                    }
                    if ( $gutters == "yes" && $multi_size == "wide-tall" ) {
                        $thumb_height = $thumb_height + 15;
                    }
                }
    
                if ( $display_type == "masonry" || $display_type == "masonry-gallery" ) {
                    $thumb_height = null;
                }
    
                $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 );
                if ( $display_type == "multi-size-masonry" && $multi_size != "" ) {
                    $thumb_gallery = rwmb_meta( 'sf_thumbnail_gallery', 'type=image&size=large-square' );
                } else {
                    if ( $columns == "2" ) {
                        $thumb_gallery = rwmb_meta( 'sf_thumbnail_gallery', 'type=image&size=thumb-image-twocol' );
                    } else {
                        $thumb_gallery = rwmb_meta( 'sf_thumbnail_gallery', 'type=image&size=thumb-image' );
                    }
                }
                $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 );
                $port_hover_bg_color      = sf_get_post_meta( $post->ID, 'sf_port_hover_bg_color', true );
                $port_hover_text_color    = sf_get_post_meta( $post->ID, 'sf_port_hover_text_color', true );
    
                if ( $port_hover_bg_color != "" ) {
                    $overlay_opacity = $sf_options['overlay_opacity'];
                    if ( $overlay_opacity == 100 ) {
                        $overlay_opacity = '1';
                    } else {
                        $overlay_opacity = '0.' . $overlay_opacity;
                    }
                    $port_hover_bg_rgb = sf_hex2rgb( $port_hover_bg_color );
                    $port_hover_style  = 'style="background-color:rgba(' . $port_hover_bg_rgb['red'] . ',' . $port_hover_bg_rgb['green'] . ',' . $port_hover_bg_rgb['blue'] . ',' . $overlay_opacity . ');"';
                }
    
                if ( $port_hover_text_color != "" ) {
                    $port_hover_text_style = 'style="color: ' . $port_hover_text_color . ';"';
                }
    
                foreach ( $thumb_image as $detail_image ) {
                    $thumb_image_id = $detail_image['ID'];
                    $thumb_img_url  = $detail_image['url'];
                    break;
                }
    
                if ( ! $thumb_image ) {
                    $thumb_image    = get_post_thumbnail_id();
                    $thumb_image_id = $thumb_image;
                    $thumb_img_url  = wp_get_attachment_url( $thumb_image, 'full' );
                }
    
                $thumb_lightbox_img_url = wp_get_attachment_url( $thumb_lightbox_image, 'full' );
                $image_alt              = esc_attr( sf_get_post_meta( $thumb_image_id, '_wp_attachment_image_alt', true ) );
    
                $item_title     = get_the_title();
                $item_subtitle  = sf_get_post_meta( $post->ID, 'sf_portfolio_subtitle', true );
                $permalink      = get_permalink();
                $item_link      = sf_portfolio_item_link();
                $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 );
                }
    
    			if ( $display_type == "gallery" || $display_type == "masonry-gallery" || $display_type == "multi-size-masonry" ) {
    			    $portfolio_thumb .= '<figure class="animated-overlay overlay-style">' . "\n";
    			} else {
    			    $portfolio_thumb .= '<figure class="animated-overlay overlay-alt">' . "\n";
    			}
    
                if ( $thumb_type == "video" ) {
    
                    $video = sf_video_embed( $thumb_video, $thumb_width, $video_height );
                    $portfolio_thumb .= '<div class="video-thumb">' . $video . '</div>';
    
                } else if ( $thumb_type == "slider" ) {
    
                    $portfolio_thumb .= '<div class="flexslider thumb-slider"><ul class="slides">' . "\n";
    
                    foreach ( $thumb_gallery as $image ) {
                        $portfolio_thumb .= "<li><a " . $item_link['config'] . "><img src='{$image['url']}' width='{$image['width']}' height='{$image['height']}' alt='{$image['alt']}' /></a></li>" . "\n";
                    }
    
                    $portfolio_thumb .= '</ul></div>' . "\n";
    
                } else {
    
                    if ( $thumb_type == "image" && $thumb_img_url == "" ) {
                        $thumb_img_url = "default";
                    }
    
                    $image = sf_aq_resize( $thumb_img_url, $thumb_width, $thumb_height, true, false );
    
                    if ( $image ) {
    
                        $portfolio_thumb .= '<a ' . $item_link['config'] . '></a>';
    
                        if ( $display_type == "multi-size-masonry" ) {
                            $portfolio_thumb .= '<div class="multi-masonry-img-wrap"><img itemprop="image" src="' . $image[0] . '" width="' . $image[1] . '" height="' . $image[2] . '" alt="' . $image_alt . '" /></div>' . "\n";
                        } else {
                            $portfolio_thumb .= '<img itemprop="image" src="' . $image[0] . '" width="' . $image[1] . '" height="' . $image[2] . '" alt="' . $image_alt . '" />' . "\n";
                        }
    
                        $portfolio_thumb .= '<div class="figcaption-wrap"></div>';
    
                        if ( $item_subtitle != "" && $hover_show_excerpt == "no" && ( $display_type == "gallery" || $display_type == "masonry-gallery" || $display_type == "multi-size-masonry" ) ) {
                            $portfolio_thumb .= '<figcaption ' . $port_hover_style . '><div class="thumb-info">';
                        } else if ( $display_type == "standard" || $display_type == "masonry" ) {
                            $portfolio_thumb .= '<figcaption ' . $port_hover_style . '><div class="thumb-info thumb-info-alt">';
                        } else if ( $hover_show_excerpt == "yes" && ( $display_type == "gallery" || $display_type == "masonry-gallery" ) ) {
                            $portfolio_thumb .= '<figcaption ' . $port_hover_style . '><div class="thumb-info thumb-info-excerpt">';
                        } else {
                            $portfolio_thumb .= '<figcaption ' . $port_hover_style . '><div class="thumb-info">';
                        }
                        if ( $display_type == "gallery" || $display_type == "masonry-gallery" || $display_type == "multi-size-masonry" ) {
                            if ( $hover_show_excerpt == "yes" ) {
                                $portfolio_thumb .= '<h4 itemprop="name headline" ' . $port_hover_text_style . '>' . $item_title . '</h4>';
                                if ( $post_excerpt != "" ) {
                                    $portfolio_thumb .= '<div class="name-divide"></div>';
                                    $portfolio_thumb .= '<div itemprop="description" ' . $port_hover_text_style . '>' . $post_excerpt . '</div>';
                                }
                            } else {
                                $portfolio_thumb .= '<h4 itemprop="name headline" ' . $port_hover_text_style . '>' . $item_title . '</h4>';
                                if ( $item_subtitle != "" ) {
                                    $portfolio_thumb .= '<div class="name-divide"></div>';
                                    $portfolio_thumb .= '<h5 itemprop="name alternativeHeadline" ' . $port_hover_text_style . '>' . $item_subtitle . '</h5>';
                                }
                            }
                        } else {
                            $portfolio_thumb .= '<i class="' . $item_link['icon'] . '"></i>';
                        }
                        $portfolio_thumb .= '</div></figcaption>';
                    }
                }
    
                $portfolio_thumb .= '</figure>' . "\n";
    
                return $portfolio_thumb;
            }
        }
    

    – Kyle

    #175162
    hotspring
    Member
    Post count: 85

    i see. luckily i am suing the child theme already. but could you tell me how i can get an access to the child theme’s functions.php file??

    is that something that i need to use FTP to download from my server? or is there a user interface within the wordpress dashboard somewhere?

    thanks,

    #175163
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Go to Appearance > Editor and select the functions.php file on the right

    – Kyle

    #175172
    hotspring
    Member
    Post count: 85

    it worked nicely! thanks!

    #175174
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    No problem

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

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register