Image-Only Promotional Pop-Up

Is there a way to only have any image display for a promotional pop-up?  My client created a .jpg in Canva and wants it displayed as the pop-up, but every layout style has text.  

Is there CSS for image-only pop-up?

You can add image for popup then share site url, we can give code to remove text

Hi @tuanphan I need to add an image as a promotional pop up with a link going to a specific URL. What is the code to remove the text? And is it possible to be able to click on the pop-up and direct it to a URL?

On 2/9/2023 at 8:59 AM, 3DDesign said:

Is there a way to only have any image display for a promotional pop-up?  My client created a .jpg in Canva and wants it displayed as the pop-up, but every layout style has text.  

Is there CSS for image-only pop-up?

I wrote a guide, see below.

#1. Click Website Tools (under Not Linked)

#2. Click Promotional Pop-Up

#3. Click Display Popup

#4. Click CHANGE LAYOUT

#5. Choose this layout (image, text, button) > Save

#6. An Image option will appear. Click on it.

#7. Upload an image and Save

You will have a result like this

#8. Click ACTION

#9. Click “Click a Button” and enter a random link

#10. Use this code to Custom CSS box to remove Text + Buttons from Popup

div.sqs-slice-group.group-copy {
    visibility: hidden !important;
}

#11. Result

On 6/11/2024 at 8:09 AM, Theresamo said:

Hi @tuanphan I need to add an image as a promotional pop up with a link going to a specific URL. What is the code to remove the text? And is it possible to be able to click on the pop-up and direct it to a URL?

You can read the quick guide I sent above.

Do #1 to #9

With #10, DO NOT use above code.

Use this new code to remove text + Make image clickable

div.sqs-slice-group.group-copy div.actions ul li a {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    color: transparent !important;
    background-color: transparent !important;
}
div.sqs-slice-group.group-copy * {
    opacity: 0 !important;
}
div.sqs-slice-group.group-copy * {
    position: static !important;
}