1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Full width Portfolio – possible customization? Need an assessment

Discussion in 'Free Divi Community Forum' started by Herrkoch, Dec 19, 2019.

  1. Herrkoch

    Herrkoch New Member

    Dear community,

    I am frustrated. I have a simple portfolio on Adobes myportfolio which I want to rebuilt in Divi, but hours and hours later I must assert that even an apparent simple design is not convertible with Divis default tools and elements and that Divi is not that flexible tool for ‚every design I can imagine‘

    To the Pro‘s of you, please have a look:

    https://herr-koch.de

    # 4-column full width thumbs

    # responsive: 1 column on mobile

    # individual Portrait Ratio

    # hover showing project title, top left alligned,

    # rounded corners

    # custom padding

    Thats all.

    Am I blind? Am I incompetent? Anybody out there who sees a solution to get this portfolio gallery managed in Divi?

    Thanks for help and kind regards – Michael.
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade horizontal timeline design for your Divi site without using any plugins:View Demo
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    Just use the fullwidth portfolio module: https://www.elegantthemes.com/documentation/divi/fullwidth-portfolio/
    The portfolio thumbnail size in Divi is landscape ratio, which is not what you're looking for.

    There's no settings in Divi to change the thumbnail size, but I did a quick search & found this: https://www.eleganttweaks.com/divi/changing-portfolio-blog-module-thumbnail-sizes/
    To align it to the top left, You can try the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
    Try to go to the Fullwidth Portfolio module settings > Advanced > Custom CSS > Portfolio Item & add:
    Code:
    Log In or Sign Up to view this code.
    Just to the module settings & add white border to it.
     
  3. Herrkoch

    Herrkoch New Member

    I thank you so much for your effort and your detailed instruction. I will give it a try and will give a feedback!
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade promo bar / notification bar with close button for your Divi site without using any plugins:View Demo
  4. Herrkoch

    Herrkoch New Member

    Thanks once more, Divi-Helper. I tried your suggested link https://www.eleganttweaks.com/divi/changing-portfolio-blog-module-thumbnail-sizes/ which looks promising and works fine for regular portfolio, but not unfortunately for fullwidth portfolio :-(

    Dit anybody chenge the thumb sizes for fullwidth portfolio entries?


    _____________________



    This is the code I added to my child functions.php


    <?php



    // Begin child theme import
    function my_theme_enqueue_styles() {

    $parent_style = 'parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
    get_stylesheet_directory_uri() . '/style.css',
    array( $parent_style ),
    wp_get_theme()->get('Version')
    );
    }
    add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
    // End child theme import

    // Begin custom image size for Portfolio Module
    add_filter( 'et_pb_portfolio_image_height', 'portfolio_size_h' );
    add_filter( 'et_pb_portfolio_image_width', 'portfolio_size_w' );


    function portfolio_size_h($height) {
    return '1080';
    }

    function portfolio_size_w($width) {
    return '528';
    }

    add_image_size( 'custom-portfolio-size', 1080, 528 );
    // End custom image size for Portfolio Module
    ?>
     
  5. Divi.Help

    Divi.Help Administrator
    Staff Member

    1. PRO MEMBER PERKS Divi Block Pro - Premade before / after image slider for your Divi site without using any plugins:View Demo