eZ Community » Forums » Setup & design » How to assign css class to image
expandshrink

How to assign css class to image

How to assign css class to image

Thursday 08 January 2009 9:59:30 pm - 3 replies

Please forgive a brand-new user what appears to be a most basic question: how to I associate a CSS class with an inserted image? That is, when I edit content (using the WYSIWYG editor) and insert an image from the media library, how do I assign that image a CSS class so I can (for instance) float the image left and wrap text around it? Thanks in advance for help.

Monday 12 January 2009 12:32:08 am

Hi Brian,

I'm not shore if I understood you well. But here is a suggestion:
- If your image is inserted in the media library of the administration interface and you want to associate it as an object in an article, than you can add the fallowing code in the xml block:

<embed size="original" align="left" offset="0" limit="1" href="ezobject://your_embed_object_id" />.

I hope this can be useful for you.
If you any question, please ask.

Monday 12 January 2009 4:01:11 am

Hello,

You can assign a class when using the online editor's embed feature. The list of classes available to use with content comes from the 'AvailableClasses' array in any one of the settings block of content.ini and templates for the class (if applicable) in override.ini

Here is an example of two different styles which came with eZ Webin package.

<embed size="medium" view="embed" class="highlighted_object" align="center" custom:offset="0" custom:limit="5" href="ezobject://168" />

<embed size="medium" view="embed" class="vertically_listed_sub_items" align="center" custom:offset="0" custom:limit="10" href="ezobject://243" />

Cheers,
Heath

Tuesday 08 December 2015 1:31:57 pm

Hello Heath,

I came upon this when searching for a similar problem. I have this in the content.ini.append.php:

[embed-type_images]

AvailableClasses[]

AvailableClasses[]=imageLeft

AvailableClasses[]=imageCenter

AvailableClasses[]=imageRight

These show up in the online editor window (pull down), but not in the produced HTML... My idea was that this woud produce either a class= to the img-object or a wrapper (<div ...>blunk.gif Emoticon around it.

Am I far out?

expandshrink

You must be logged in to post messages in this topic!

36 542 Users on board!

Forums menu

Proudly Developed with from