How do I add inline css in Magentocommerce page from admin? - css

I just want to add
<style type="text/css>
my_inline_style...
</style>
In one page. I know I can add things like this from Layout Update XML:
<reference name="head">
<action name="addCss"><stylesheet>externalCss.css</stylesheet></action>
</reference>
But where is it documented to write inline css from that area?

I had a similar situation and arrive at this solution. That is not elegant but is useful (you can add any text throw layout update).
Add something like this to the layout update:
<reference name="head">
<block type="core/text" name="custom_css">
<action method="setText">
<text><![CDATA[
<style type="text/css">
.my-class {
color: red;
}
</style> ]]>
</text>
</action>
</block>
</reference>
Btw, It is hard to add the CSS style inline into the cms blocks because is hidden by some process inside the WYSIWYG editor after you save the block.

Related

React: Index.css is not applying after added :id to url params

i am using react and had all of my pages import index.css (because i called it from index.html).
After i added /:id parameter to the url of pages it suddenly stopped getting the style from the index.css but does take it from other css files that are imported directly to the page in react.
The route looks like this now:
<PrivateRoute path="/:id/whatsapper" component={Whatsapper} isAuthenticated={isAuthenticated} />
and before looked like:
<PrivateRoute path="/whatsapper" component={Whatsapper} isAuthenticated={isAuthenticated} />
Was anyone facing this issue?
Why is is happenning?
I found the issue,
i imported the css like :
<link rel="stylesheet" href="./index.css" />
instead of :
<link rel="stylesheet" href="/index.css" />

TinyMCE React strips out <style /> tag when placed inside the <head /> tag

I am using TinyMCE React with fullpage and code plugins enabled to create email templates. I am trying to insert a <style /> with custom css classes defined inside the <head />. But every time I reload the component, the <style /> is being stripped out. Here is a simplified exampled:
...
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
Is this scenario supported? I have looked at a number of similar issues such as this. They seem to suggest the use of the valid_children option. As I understand, this option allows the inclusion of "invalid" tags inside parent tags. But <style /> inside <head /> is valid.
Any help would be greatly appreciated
Without knowing more about how you have TinyMCE configured it is very hard to say what is causing this issue. I am certainly able to load a style in the head of a document managed by TinyMCE as shown in this TinyMCE Fiddle:
http://fiddle.tinymce.com/cPgaab/2
How is your TinyMCE configured? If you update this fiddle to use your configuration is the style no longer kept?

how to add custom css to specific page to magento by external css file in layout update xml

Adding custom css to specific page to magento by external css file in layout update xml, i only want to style the HTML code elements on my page content area.
Im creating drop down menu on the page content area, and inline css dose not support ul, li, hover etc function, the only way to style it will be adding custom css to it. And i must connect externally.
here is my code:
<reference name="head">
<block type="core/text" name="drop_down_menu_lock">
<action method="setText">
<text><![CDATA[<link rel="stylesheet" type="text/css" href="http://link/public_html/wordpress/drop_down_menu_lock.css">]]>
</text>
</action>
</block>
</reference>
Hello you can add below code into specific page xml like this
<catalog_product_view translate="label">
<reference name="head">
<block type="core/text" name="drop_down_menu_lock">
<action method="setText">
<text><![CDATA[<link rel="stylesheet" type="text/css" href="http://link/public_html/wordpress/drop_down_menu_lock.css">]]>
</text>
</action>
</block>
</reference>
</catalog_product_view>

Redirect CSS URL to one without www subdomain

I would like to know if there is a way to remove www (or add) when happens a request.
Here's my problem:
I'm inserting CSS this way: "//domain.com.br/resources/cssname.css"
if I access a page http, everything works perfectly, but when I access a page https USING "www.domain.com.br" the page doesn't load CSS files
if I insert CSS like this: "//WWW.domain.com.br/resources/cssname.css" the oposite happens, and when i access a page using "domain.com.br" there is no css.
Could I change all requests when using remove wwww or all request add www?
I saw that prettyfaces has could that be done using this?
Also, I'm using glassfish, I don't know if this can be done by there or by provider.
Thanks.
You should not be worrying about the domain name nor the context path in all your CSS/JS/image resources at all.
Instead of
<link rel="stylesheet" href="//domain.com/context/resources/style/some.css" />
<script src="//domain.com/context/resources/script/some.js"></script>
<img src="//domain.com/context/resources/images/some.png" />
or even
<link rel="stylesheet" href="#{request.contextPath}/resources/style/some.css" />
<script src="#{request.contextPath}/resources/script/some.js"></script>
<img src="#{request.contextPath}/resources/images/some.png" />
or even the clumsily longer as suggested by other answer
<link rel="stylesheet" href="#{facesContext.externalContext.requestContextPath}/resources/style/some.css" />
<script src="#{facesContext.externalContext.requestContextPath}/resources/script/some.js"></script>
<img src="#{facesContext.externalContext.requestContextPath}/resources/images/some.png" />
you should actually be using
<h:outputStylesheet name="style/some.css" />
<h:outputScript name="script/some.js" />
<h:graphicImage name="images/some.png" />
And, for CSS background images, instead of
.some {
background-image: url("../images/some.png");
}
you should actually be using
.some {
background-image: url("#{resource['images/some.png']}");
}
See also:
How to reference CSS / JS / image resource in Facelets template?
What is the JSF resource library for and how should it be used?
Changing JSF prefix to suffix mapping forces me to reapply the mapping on CSS background images
Personally, I always use:
#{facesContext.externalContext.requestContextPath}/resources/cssname.css
As the path to any of my resources.
This way, I am sure that I am always getting the right path to my resource.
Hope this helps
Cheers

Styling velocity markup with css in confluence 4.0

I have written a confluence macro. It uses velocity to generate html table. How can I style this markup with css if I don't use <html> and <head> tags in my velocity model. I have tried to do as in this example but id doesn't work(I mean it takes no effect and there is no css resource file that I have specified inclusion on the code of result page of macro)
if i understand you correctly
you need to add links on your css files to atlasian-plugin.xml for example
<atlassian-plugin name='Just name' key='com.your.path.to.lib'
plugins-version="2">
<resource type="download" name="style.css" location="css/style.css">
<property key="content-type" value="text/css"/>
</resource>
</atlassian-plugin>
after that you need to add this link to the top of your velocity template
<link rel="stylesheet" href="$req.contextPath/com.your.path.to.lib/style.css"
type="text/css"/>

Resources