Timeline Image - Question | JoomShaper

Timeline Image

G

Georgios

SP Page Builder 1 week ago

Hi, I want to use the timeline addon, but instead of a date I want to insert and Image or Icon. Is it possible in any way? Best Regards George

0
3 Answers
G
Georgios
Accepted Answer
4 days ago #223284

Yes you are right. Isolved it wit the custom CSS. It only works, when you activate the start date form by typing something words or better keywords for your SEO ;) . This example is for an image that is used as a global placeholder. You can also use a custom image for each individual item. Thanks Ziaul.

/ 1. Make the placeholder text invisible /

.timeline-date { font-size: 0 !important; / Makes the text "Keywords" invisible without breaking the layout / margin: 0; padding: 0; }

/ 2. Insert the PNG / Icon /

.timeline-date::before { content: ""; / Essential for the element to be rendered / display: inline-block; background-image: url('https://www.yourpage.com/yourImage'); / INSERT YOUR IMAGE URL HERE / background-size: contain; background-repeat: no-repeat; background-position: left top; / Aligns the icon to the left /

/* Icon size (adjust these values as needed) */
width: 140px; 
height: 140px;

}

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 4 days ago #223286

You are welcome.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 6 days ago #223116

Hi Georgios,

Thank you for reaching out to us.

Currently, the Timeline addon in SP Page Builder is designed to use a date field as part of its default structure, and there isn’t a built-in option to replace the date directly with an image or icon.

As a workaround, you may:

  • Use custom CSS to hide the date and visually replace it.

If you need this functionality as a native feature (e.g., replacing the date field entirely with an image/icon), it would require overriding or customizing the addon. For that level of modification, you would need to hire a developer.

Best regards,

0