Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
lexcamille

Replace logo image only on SHOP page and for all products that fall under it

Question

Hi! I want to replace the logo on my page, but only on one of my shop pages (and all of the product listings that fall under it) This code I got from a helpful user on here earlier, overrides the logo on the shop page as desired, but the original logo is still visible when you click into any of the product pages.


  /* Hide current logo on shop page */
    #collection-5d41998789ce3b0001e47211 .logo-image img {
        visibility: hidden;
    }
    /* Insert new logo on shop page */
    body#collection-5d41998789ce3b0001e47211 .logo-image a {
        background-image: url(https://static1.squarespace.com/static/5bf1b4f6f8370a9863e71c8d/t/5d4525d5b0f59800018daf77/1564812757406/destashlogo_2_original.png);
        display: block;
        width: 325px;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
        margin-top: 0px;
        margin-bottom: 0px;
    }


page I want the changes to effect: www.lexadazy.com/dazydestash (and all of the product listings that fall underneath this shop page)

Anything I can alter in this code to make it function under all of the product listings too?

Thanks so much!

Edited by lexcamille
Initial Revision

Share this post


Link to post

13 answers to this question

Recommended Posts

  • 1

@lexcamille I checked. The way I said above seems impossible. You will need to write CSS manually, if you have 100 products, it will need a few dozen CSS lines

eg. product01-id, product02-id, product03 id,.... {.logo-image img {CSS}}


You can send your question to my email to get faster answer. I provide free priority support in this crazy time. 

How to Setup Password & Share URL - Free Templates - Free Code - CSS ID List

Share this post


Link to post
  • 0

@lexcamille


/* Hide current logo on Product Listing Pages */
.collection-type-products.view-list .logo-image a {
   visibility: hidden;
}
.collection-type-products.view-list .logo-image img {
   display: none;
}
/* Insert New Logo on Product Listing Pages */
.collection-type-products.view-list .logo-image a:after {
   visibility: visible;
   content: "";
   background-image: url(https://image.flaticon.com/icons/svg/1279/1279537.svg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center center;
   width: 200px;
   height: 100px;
   display: inline-block;
   margin-bottom: 10px;
}





You can send your question to my email to get faster answer. I provide free priority support in this crazy time. 

How to Setup Password & Share URL - Free Templates - Free Code - CSS ID List

Share this post


Link to post
  • 0

Sorry that didn't work for me either :( This code overrides my uploaded logo on all pages (except the product listing pages)

I was hoping to keep my original, uploaded logo on my main shop page (www.lexadazy.com/shop) and all of its sub-pages.

I want my secondary logo to only appear on my 2nd shop page (www.lexadazy.com/dazydestash) and all of the product listings underneath it. When I applied this code to my Custom CSS section, the original logo is still there when I click into the product listings.

Share this post


Link to post
  • 0

Nope sorry I didn't specify- the categories retain the logo and look great (with the previous code you gave me) but Individual product pages still show the original logo.. example:

https://www.lexadazy.com/dazydestash/13x18mm-mother-of-pearl-oval-cab-1-pc

The code you gave me earlier, is the code I am using currently because it displays the correct logo's on the correct shop pages (jewelry [lexadazy logo] vs. dazydestash [dazydestash logo])

Share this post


Link to post
  • 0

Yes, jewelry shop page & all products underneath: Lexadazy logo.

Dazydestash shop page & all products underneath it: Dazydestash logo.

Presently, all products display Lexadazy logo

Share this post


Link to post
  • 0

@lexcamille It will need a lot of CSS.Products belonging to a certain product category will have different CSS ID/Class. You will need to write CSS for all those categories, it seems lot of code, but that is the easiest and only way I think now.

I will send in the next few hours.


You can send your question to my email to get faster answer. I provide free priority support in this crazy time. 

How to Setup Password & Share URL - Free Templates - Free Code - CSS ID List

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...