Viewing 22 posts - 1 through 22 (of 22 total)
  • Author
    Posts
  • #1334060
    #1334175

    Hi envis,

    Please see response in private content.

    Best regards,
    Nikko

    #1340057

    Nikko,

    I can not filter a dynamic IP. So I have no means of revealing to you this page. But the brands overview page does not show a logo.
    I have created a login for you as a reader so you can view the page. Check private data please.

    With kind regards,

    Gerben

    #1340454

    Hi Gerben,

    Thanks, please try adding this code in your child theme’s functions.php:

    add_action( 'woocommerce_before_shop_loop', 'add_brand_woocommerce_before_shop_loop', 19 );
    
    function add_brand_woocommerce_before_shop_loop() {
    	echo do_shortcode('[product_brand width="128px" height="128px" class="alignleft"]');
    }

    Hope it helps.

    Best regards,
    Nikko

    #1340593

    Nikko,

    Thank you for your proposed solution. This displays 2 logos on the page and they are below the description of the brand. Can you tell me how I can adjust the code to display the logo above the content?

    Screenshot of the brand page

    #1340802

    Hi envis,

    Please replace this part of the code:

    add_action( 'woocommerce_before_shop_loop', 'add_brand_woocommerce_before_shop_loop', 19 );

    to:

    add_action( 'woocommerce_before_shop_loop', 'add_brand_woocommerce_before_shop_loop', 5 );

    Best regards,
    Nikko

    #1340804

    Nikko, if a product bundle consists of mutiple brands and is included in the brands page, then there will be 2 logo’s above the page.
    Is this something that can be fixed?

    Screenshot of brands page which features product bundles with mutiple brands

    #1340813

    Hi envis,

    Yes, please replace this code:

    function add_brand_woocommerce_before_shop_loop() {
    	echo do_shortcode('[product_brand width="128px" height="128px" class="alignleft"]');
    }

    with:

    function add_brand_woocommerce_before_shop_loop() {
    	global $wp_query;
    	$brand_id = $wp_query->get_queried_object()->term_id;
    	$thumbnail_id = WC_Brands::get_term_meta( $brand_id, 'thumbnail_id', true );
    	if ( $thumbnail_id ) {
    		$thumb_src = wp_get_attachment_image_src( $thumbnail_id, $size );
    		echo "<img src=\"{$thumb_src[0]}\" width=\"{$thumb_src[1]}\" height=\"{$thumb_src[2]}\" />";
    	}
    }

    Best regards,
    Nikko

    #1340899

    Nikko,

    Notice: Undefined variable: size in functions.php on line 66

    Line 66:
    $thumb_src = wp_get_attachment_image_src( $thumbnail_id, $size );

    Does this have to do with SVG image support?

    • This reply was modified 2 years ago by envis.
    #1340987

    Nikko, I am pretty sure it has something to do with a SVG filetype. So I tried to do something like this: detect the filetype, then return the content of the SVG as source in the page or if PNG/JPG just use normal <img src.
    I don’t have the skills to do this right, but maybe you can make it work :)

    /**
     * Adds logo to brand page
     */
    
    add_action( 'woocommerce_before_shop_loop', 'add_brand_woocommerce_before_shop_loop', 5 );
    function add_brand_woocommerce_before_shop_loop() {
    	global $wp_query;
    	$brand_id = $wp_query->get_queried_object()->term_id;
    	$thumbnail_id = WC_Brands::get_term_meta( $brand_id, 'thumbnail_id', true );
    
            $file_info = pathinfo( wp_get_attachment_url( $thumbnail_id ) );
    
    	if ( $thumbnail_id ) {
    	        if ( $file_info['extension'] === 'svg' ) {
    		        echo file_get_contents( wp_get_attachment_url( $thumbnail_id ) );
                    } else {
    		        $thumb_src = wp_get_attachment_image_src( $thumbnail_id, $size );
    		        echo "<img src="{$thumb_src[0]}" width="{$thumb_src[1]}" height="{$thumb_src[2]}" />";
                    }
    	}
    }
    • This reply was modified 2 years ago by envis.
    #1341071

    Hi envis,

    I think the issue is with the variable $size though I never got an issue on my end, please try to replace:

    $thumb_src = wp_get_attachment_image_src( $thumbnail_id, $size );

    with:

    $thumb_src = wp_get_attachment_image_src( $thumbnail_id, 'full' );

    Best regards,
    Nikko

    #1341313

    Nikko,

    The code puts the SVG on the page with size 1 by 1 px.
    <img src="https://www.qsolarpanels.nl/wp-content/uploads/2022/01/Huawei_logo.svg" width="1" height="1">

    So I added some code to make them show:

    /* SVG brands overview */
    div#our-brands-logo {
        margin-bottom: 20px;
    }
    
    div.our-brands-logo img[src$=".svg"] {
        height: 120px !important;
    	width: auto !important;
    }

    The problem is now that the normal categorie show a large thumb above it. How can I show logo, but hide that thumb?

    #1341552

    Hi envis,

    Please replace the whole code with this, so it should target only the brand archives page:

    add_action( 'woocommerce_before_shop_loop', 'add_brand_woocommerce_before_shop_loop', 5 );
    function add_brand_woocommerce_before_shop_loop() {
    	if (is_tax('product_brand')) {
    		global $wp_query;
    		$brand_id = $wp_query->get_queried_object()->term_id;
    		$thumbnail_id = WC_Brands::get_term_meta( $brand_id, 'thumbnail_id', true );
    
            	$file_info = pathinfo( wp_get_attachment_url( $thumbnail_id ) );
    
    		if ( $thumbnail_id ) {
    	        	if ( $file_info['extension'] === 'svg' ) {
    		        	echo file_get_contents( wp_get_attachment_url( $thumbnail_id ) );
                    	} else {
    		        	$thumb_src = wp_get_attachment_image_src( $thumbnail_id, 'full' );
    		        	echo "<img src="{$thumb_src[0]}" />";
                    	}
    		}
    	}
    }

    Best regards,
    Nikko

    #1341553
    This reply has been marked as private.
    #1341554

    Nikko,

    I had to escape the ” in one line of your code:
    echo "<img src=\"{$thumb_src[0]}\" />";

    Then it works, but with 2 major downsides:

    1. Logo is extremely biga (looking into a CSS-fix)
    2. The logo changes the colors of main logo (here the black in de logo is turned into yellow of van der valk logo)

    Screenshot

    Best regards,

    Gerben

    • This reply was modified 2 years ago by envis.
    #1341560

    Hi Gerben,

    I’m glad that you were able to fix it.
    As for the logo, I can’t get to see it on my end and try to inspect what’s happening (I have posted a screenshot in private content on how it looks on my end).
    It seems I can only see it if I’m logged in however the credentials don’t work anymore.

    Best regards,
    Nikko

    #1341729

    Nikko,

    The logo of the website has the same colors as the logo of the brand. So that’s why it looks good in your screenshot, but not for the other brand. For the other brandpages the brands logo messes up color of the website logo.

    Read below in private comments.

    Best regards,

    Gerben

    #1341902

    Hi Gerben,

    Thanks, the logo and the brand logo seems to be using the same class which causes it to override the colors.
    I have attached screenshots showing that both logo and brand logo are using the classnames .st0 and .st1.

    Best regards,
    Nikko

    #1341975

    Nikko,

    This is new for me, are the classes stored inside the SVG-file? I just downloaded them from their respected websites.
    So I have to change them manually? or is there another solution?

    With kind regards,

    Gerben

    #1341985

    Hi Gerben,

    Please try adding this CSS code in Enfold > General Styling > Quick CSS:

    .logo .st0 {
        fill: #231f20;
    }
    
    .logo .st1 {
        fill: #00aeef;
    }

    Best regards,
    Nikko

    #1346934

    Nikko, that fixed it for me. As I understand correctly both documents used the same CSS Classes and this gave the logo a default color. Thanx a lot!

    #1346982

    Hi,
    Glad Nikko was able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 22 posts - 1 through 22 (of 22 total)
  • The topic ‘WooCommerce Brands overview page’ is closed to new replies.