Display round images in your website

You can change the appearance of an image when you choose to edit the underlying HTML of an Article.

You may for example want to convert a square image into a round one, or perhaps square off or round the corners of another image.

But not everyone wants to have to edit the underlying HTML.

It is good to know then that the image editor included with the JCE Content Editor extension, enables you to make such changes without editing the HTML.

It is first however necessary to create some CUSTOM STYLES, ouch!

No worries, WYNCHCO website designs include the following CUSTOM IMAGE STYLES to help you.

CUSTOM IMAGE STYLES

We include these CUSTOM STYLES in every WYNCHCO website design to help you style images.

CUSTOM STYLES

Use these Custom Styles to LOCALLY change the appearance of an image.

Local style will override any GLOBALLY assigned Custom Style.

Local style is shown in bold.

circle

Use this style to make a square image perfectly round.

Or to make a rectangular image oval.

rounded5

Use this style to make the corners of an image round (radius 5 px).

rounded10

Use this style to make the corners of an image round (radius 10 px).

rounded15

Use this style to make the corners of an image round (radius 15 px).

squared

Use this style to make the corners of an image square.

Add a Custom Style to an Image using JCE Content Editor

Add a Custom Style to change the appearance of an image in two simple steps using the JCE Content Editor.

STEP 1: Select Image to Edit

STEP 2: Add CUSTOM STYLE

Preview Result in Front End

PERSONAL Joomla! CMS Help & Support

We coach, help and support managers with responsibility for Joomla! websites in organisations across Cheshire, Manchester, Merseyside, North West England & the UK.

1-responsive-website-design-cheshire-manchester-merseyside-uk.png

Details: Last Updated: 14 June 2019