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

Text Over Image


Lauri
Go to solution Solved by tuanphan,

Question

  • Answers 5
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Add to Home > Design > Custom CSS figure.gallery-masory-item { position: relative; } .gallery-caption { position: static; } /* title */ .gallery-caption-wrapper p { position: abs

Posted Images

5 answers to this question

Recommended Posts

  • 0
19 minutes ago, Lauri said:

Hi, I’ve edited the section and added text under the description box. Would appreciate the code to move it over image with the same font as on page. 

Add to Home > Design > Custom CSS

figure.gallery-masory-item {
    position: relative;
}
.gallery-caption {
    position: static;
}
/* title */
.gallery-caption-wrapper p {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
    padding: 7%;
    transition: opacity ease 200ms !important;
    opacity: 0 !important;
pointer-events: none;
}
.gallery-masonry-item:hover .gallery-caption-wrapper p {
    opacity: 1 !important;
}
/* overlay */
.gallery-masonry-item-wrapper a:after {
    background: #f4f6ea; /* overlay color */
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity ease 200ms !important;
}
.gallery-masonry-item:hover .gallery-masonry-item-wrapper a:after {
    opacity: 0.75;
}
/* remove gap */
figcaption {
    padding: 0 !important;
}

 

Link to post
  • 0
On 10/29/2020 at 6:22 AM, Lauri said:

@tuanphan... Your help would be greatly appreciated on this. 

You mean gallery under Freeship50 text?

If yes, you can edit gallery > edit images > add a text in Description box > It will appear under image > we will give the code to move it over image.

Link to post
  • 0
On 10/31/2020 at 3:18 AM, tuanphan said:

You mean gallery under Freeship50 text?

If yes, you can edit gallery > edit images > add a text in Description box > It will appear under image > we will give the code to move it over image.

Hi, I’ve edited the section and added text under the description box. Would appreciate the code to move it over image with the same font as on page. 

Link to post
  • 0

@Lauri I see your site has some other problems.

1. (Mobile) Facebook chat overlap Cookie notice, so you can't close cookie.

You can add this to Home > Design > Custom CSS to move Cookie position

@media screen and (max-width:767px) {
.sqs-cookie-banner-v2 {
    bottom: 50px !important;
}
}

image.thumb.png.46ec61a5acda6c0daf019e0a8bc1b738.png

2. You haven't changed SEO Tile for this page

https://www.statementmakerz.com/earrings

so you will see in Browser Tab Title "Store 2"

3. (Mobile) I think some product list page is too long, you can add a back to top button for users.

If you need this, I will give the code.

4. (Mobile) Product detail page. Breadcrumb is closer header, I think you should increase space between them.

5. (Mobile) Products show number (1/3..) over image, I think you can add Arrows slide, users can easily navigate to view more photos. 

Add to Home > Design > Custom CSS (for both problems 4 & 5)

@media screen and (max-width:767px) {
/* space between breadcrumb - header */
.ProductItem-nav-breadcrumb {
    margin-top: 30px;
}
/* Product slideshow arrows */
.ProductItem-gallery-carousel-controls {
    display: flex !important;
}
/* arrows background */
.ProductItem-gallery-carousel-controls * {
    background: white;
}
.ProductItem-gallery-carousel-controls>div {
    justify-content: center !important;
}
}

 

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...