External css not working in Broadleaf Email Templates - css

I am using a custom email template in broadleaf. In that I am unable to use external css file.It's only allowing inline css. Is it will function like that or Is i am doing anything wrong.
This is how i am referring my css file
Both are not working.Kindly Have your say on this friends.

Most likely the email client will block external links and therefore your mail will not appear as you think it should. So its better you write the inline css for emailer.

Related

CKEditor removing inline CSS

It might sound like a duplicate of a lot of questions, but what differs in this is that I am building a mail body in CKEditor where I must apply inline-css as I don't have class in the user's mailbox.
I am applying inline-css but that is removed automatically by CKEditor. Any solution or suggestion for this?
You might not have configured the allowed content.
see: http://docs.ckeditor.com/#!/api/CKEDITOR.feature-property-allowedContent

Where to Put CSS in mandrill template

I was using mandrill for sending mails . Using mandrill template functionality, i have properly coded on server side to send the mails. I am receiving the mails, but CSS is not properly rendered. In my code i have set inline_CSS = 'true'. Also, in Mandrill in settings-> sending options i have set 'Inline CSS Styles In HTML Emails' = true. But still when i design a template its not rendered properly in 'preview and test' and also if send via API.
In Addition to this, i need to know how to add CSS file to your template dir. OR how to give the link to this CSS file. Because doing the settings is ok, but there should be some place where i need to put that file or pass it some way.
Mail clients cannot load style content from an externally-linked stylesheet. There is no local file path/system, so all style must be included within the template itself, between <style> tags.

How to attach html file so that gmail's "view" option works

I have a script that sends an email with an html attachment. When I select "view" in gmail I get text...however when I click on "download" instead of "view", then open it, it displays as it should.
I think it's gmail related because I observe the exact same behavior from IE, FireFox(win/linux), Chrome(win/linux)
I made a youtube video of here:
http://www.youtube.com/watch?v=WkGyxcFQXS8
Am I doing something wrong?
Thanks
Not all email clients support the <style> tag. Gmail is one of those; it only respects in-line styling.
If your code is producing the css & html, then you could change it to use in-line styles for the table.
If you want something more auto-magic, see How do I use Google Apps Script to change a CSS page to one with inline styles?.
One way around this would be to have your script simply host the HTML file somewhere, and email a link to that file.
I cannot find any documentation from Google or the GMail team, but I would be surprised if they allowed HTML attachments to be opened and viewed (this would be a security risk, since they would essentially allow their email servers to host user-generated web content).

How to create CSS internal style sheet in CakePHP

I have been using CakePHP for a while and recently needed to send emails from an app. Unfortunately I can not figure out a way to tell CakePHP to include the css directly in the document as an internal style sheet instead of a link. I know people think that is a bad idea, but my app is only sending emails to our company so I'm not worried too much about someone's email client messing it up. If I just include the link it doesn't work since the reference is wrong, although if I could make the link an absolute link (http://myserver/css/myfile.css instead of /css/myfile.css) that would be a 2nd best alternative since they would have access to my server.
If there isn't a way to do it in Cake, is there a quick way to just use PHP to read the contents of the file and dump it in the view? I guess I could do that from the controller, sounds like a bad hack though.
Any ideas would be appreciated, thanks
You could use readfile() to print the file content directly in your view.
Or you could $this->Html->url('css/yourcss.css', true) to get the full path to the file and pass it too the css method.
I would like to suggest you to use php variable as style class and use it directly as css class. For example.
$class1 = "border : 1px solid #eeeeee; font-family : font1, font2, font3; color : #785634;"
And use it in your email template as
<div id='my-div' style=<?php echo $class1; ?>>Your div content </div>
Even I do not know any way to include style sheet in the email, and if you create some classes those will not work in email templates.
So this is how I'm using css in my projects.
you can put the css in email layout like normal html (use html email layout)
<style type="text/css"></style>
Reviewing the code of the htmlHelper shows that it can't be done.
However, you can change or overload the helper; to do so in the simplest way just add a new option between line 371 to 378.
I used PHP's include function enclosed in a script tag and it worked perfectly! In the default email view:
<script>
include('css/your_css_doc.css');`
</script>
You can write css inline:
<h2 style="color:#818381">Here are the latest stories everyone's talking about...</h2>

Ajax Request and CSS-Change to Links

I use an AJAX-Request to load a part of a Webpage, the request is handled by a framework, which delivers the content. After that, I use jquery to insert the delivered content into the DOM-Tree. So far, so good.
But I use background-images for links in the delivered content, which are generated while processing the AJAX-Request. Normally I would place the path to the background-image into a style-attribute in the link-tags, what works perfectly, until I want to use pseudo-classes for i.e. :hover (you know, to display an alternative image while the mouse hovers)
The solution would be to create a custom CSS-file, which will be inserted into the HTML-Head, but until it is an AJAX-Request, the HTML-Head is already sent.
Do you have any idea, how to attach CSS-properties to links, which will be generated on AJAX-Call-Time?
not possible with inline style.
as s jones says, you can have the style in your existing CSS and it should pick it up.
the other option is to do it using jquery..
$('div.ajax a').hover(function(){$(this).css('color','red')});

Resources