Expresso
ExpressionEngine 2, ExpressionEngine 3, ExpressionEngine 4, ExpressionEngine 5
Back to this add-on's main page
View Other Add-ons From PutYourLightsOn
Link to external CSS
Support (Resolved)
meslater
|
Posted: 11 April 2017 08:39 PM |
|
|
|
In the docs under CSS it says
CSS
Any CSS code you add here will be applied to the Expresso WYSIWYG editor (it will not be applied to the rendered content). You can also add the url to a CSS file if you prefer.
Where do you add the link to your external css file??
When I try to add styles using the sample format the styles drop down is blank. I am following the code I just want to give the user the opportunity to add some classes to text in the espresso field.
Any guidance would be greatly appreciated.
|
|
|
PutYourLightsOn
|
Posted: 12 April 2017 10:12 AM |
# 1
|
|
Developer
|
You may be confusing the CSS and Styles settings.
The CSS setting is where you can write CSS rules, or enter the full URL to a CSS file which contains the styles you want applied to the editor content when editing on the entry screen. These styles have no effect on the content which is output by Expresso in your templates.
The Styles setting is where you can enter custom rules to be added to the Styles dropdown in order to allow you to apply class names or style attributes to specific elements in the editor, following the format outlined in the docs, e.g.,
{ name: "Red Title" , element: "h3", styles: { "color": "Red" } }, { name: "CSS Style", element: "span", attributes: { "class": "my_style" } }, { name: "Marker: Yellow", element: "span", styles: { "background-color": "Yellow" } }
Note that you cannot apply custom Styles via individual field settings - they can only be added globally via the global fieldtype settings.
|
|
|
meslater
|
Posted: 12 April 2017 10:18 AM |
# 2
|
|
|
Actually I want to do both I didn’t explain it well.
When i post the sample code in the styles setting the styles dropdown goes blank in the editor.
{ name: "CSS Style", element: "span", attributes: { "class": "my_style" } }
I would like to apply the CSS to the publishing view but cant figure out where to enter the URL
|
|
|
PutYourLightsOn
|
Posted: 12 April 2017 10:40 AM |
# 3
|
|
Developer
|
What version of Expresso are you running? I just ued the exact code you pasted above in the Styles setting of my test install, and “CSS Style” shows up as an option in the editor’s Styles dropdown menu.
Re: CSS file - simple paste the complete URL to your CSS file in the CSS setting field.
|
|
|
meslater
|
Posted: 13 April 2017 06:49 PM |
# 4
|
|
|
What I am trying to do is put an inline style for an anchor
So this displays in the drop down.
{ name: “CSS Style”, element: “span”, attributes: { “class”: “my_style” } }
but this makes it blank
{ name: “CSS Style”, element: “a”, attributes: { “class”: “external_link” } }
|
|
|
meslater
|
Posted: 13 April 2017 06:51 PM |
# 5
|
|
|
Also I would really like to understand how to attach and external style sheet so that the publishing view can be styled.
|
|
|
PutYourLightsOn
|
Posted: 14 April 2017 11:49 AM |
# 6
|
|
Developer
|
For some elements the menu styles will only appear when you have that element selected in the editor. (This is CKEditor’s behaviour.) So if you create a link, then select it, you’ll see that the Style menu will then have your custom anchor tag style in it.
The external stylesheet is done just how I said - paste the URL of your stylesheet in the CSS setting textarea. i.e., https://dsh.re/5efff
|
|
|