Complex addon - Forum | JoomShaper
Solved SP Page Builder

Complex addon

Asked by Chris Cuypers 4 years ago Last activity 4 years ago

Hi, I want to create a rotated image with a textbox and a numer displayed in a cricle.
How can I do that?

I made a screenshot but I cant upload images here.

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff
4 years ago · edited

I would use for text box classe (each should have unique name)

::before { content: "1."; color: white; background: #3A4427; border-radius: 100%; padding: 10px;}

or something like this, then control position Y

whole rest in your hands.

6 more replies

Oldest first Newest first Most helpful
Paul Frankowski Senior Staff
4 years ago · edited

Hi Chris,
you can upload image on your hosting (site) and share link to that image.

We have: Slideshow, Team Carousel, Testimonial Carousel, Image Carousel, and Clients addons - and only those 5 have slider (carousel) feature you can use for your purpose. If none of them, in that case you have to find different module on JED (Joomla Extension Director) and then use it inside Module addon.

Sorry, but I cannot help you with addon code customization.

BTW

There are also commercial packages of addons (for example Ultimate Extra Addons, WT Extra Addons) that you can order from other developers.

Paul Frankowski Senior Staff
4 years ago

Now is more clear. If this should be a carousel with changing text and image, on your place I would use probably Slideshow addon with some extra custom CSS. Why? Becuase that addon allows you to use different addons inside slide items, so you can have image, text etc. without touching php code.

I guess, this is commercial project, so you're not a CSS beginner. You should be able to make it

Chris Cuypers Asked this
4 years ago

Hi,
Thanks for quick reply.
But no its not a carrousel. So far I used the image addon. I want to rotate that image as in the screenshot.

For the text I used the text block addon. But I also want that number shown in the round layout.

When I alter the css all image-addons rotate, but I dont want that.

My progress so far:
https://echt.vierseizoenenbuiten.nl/uploads/2.png

Chris Cuypers Asked this
4 years ago

*Update.

Fixed the image rotation. Forgot to define class in the general tab of the addon....
Then I used custom css code in custom css at style tab.

I used thsi code:
.voordeelimage1 {
transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-webkit-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
}

https://echt.vierseizoenenbuiten.nl/uploads/3.png

Now only the rounded number thing. Any ideas for that?

Chris Cuypers Asked this
4 years ago

Thanks for the help.

Log in to reply.