Hot answers tagged

27

I'd say you're not missing much at this stage in the game and if you are using preprocessors then even more reason to not use EE CSS templates. With that said, I could see if you wanted to give your clients access to edit certain colors, for example href colors, then you could build something dynamic which allowed them to edit said colors via GVs, Snippets ...


14

There is a one year old thread on Pixel&Tonic’s support forum. To use Typekit with Wygwam/CKEditor you have to include two scripts in your <head>: <script type="text/javascript" src="//use.typekit.net/XXXXXXXX.js"></script> <script type="text/javascript">try{Typekit.load();}catch(e){}</script> Scott Wise figured out this ...


11

Very rarely will I run CSS through EE. There are times when it's useful as Nate has said but generally it's another load on the template parser that doesn't need to be there. I also generally keep my 404 page outside of EE as well because it's another db load that doesn't need to be there. I never edit templates in production either.


9

I think the easiest way would be to make sure that your call to the css file is within your channel entries loop and that you name your css files the same as your channel short names. {exp:channel:entries limit="1"} <head> <link href="path/to/css/folder/{channel}_styles.css" rel="stylesheet" /> </head> <body> {title} {...


7

The main advantage of using CSS templates over flat files (as Natetronn has mentioned) is the cache busting EE provides. EE adds a version number to the end of the file name automatically and this will flush the CSS out of browser caches each time you update the CSS. This can be highly important if your main audience is sitting behind a corporate firewall as ...


7

Install the Streeng plugin. Perform common operations on strings. Change case, truncate, find/replace, repeat, encode/decode, generate slugs and more. One of the parameter options is capitalize="yes" which lets you capitalize the first character of the string.


6

I've just used SASS for the first time on a project and I ended up with a bit of a hybrid solution. I had one main.css stylesheet which was generated by Compass (for all the SASS goodness). This just overwrites the EE CSS template when it generates. I then had a second stylesheet dynamic.css which was used purely for stuff which the client could edit, ...


6

CE String is another great option. CE String is a string manipulation tool for use in your ExpressionEngine templates. It is feature-packed, and allows you to manipulate strings (text) with very simple syntax. You would just do: {exp:ce_str:ing strtoupper}{segment_2}{/exp:ce_str:ing} CE String has tons of other useful methods. And the chaining feature ...


6

I've been done this sometimes. Since this code is used just on some pages, I suggest you to not use a CSS file, but the <style> tag on the head of the HTML. This situation doesn't even worth the download of the CSS: it's one single rule to be used just on one single page. This can be an snippet: {exp:channel:entries channel="{pr_channel}"} <style&...


5

This is a CSS issue I think. Try a CSS selector like ul > li.active to make sure it's targeting just the first tier li.


5

After a few minutes I was able to figure out an easy way to do this. I found a similar question here on EESE about adding custom JS to a new entry. I was able to put the CSS I needed right in instructions of the field. I had to keep everything on one line, because the field instructions look like they're being parsed with XHTML, so it was adding paragraph ...


5

You can also swap to the very similar addon Wyvern, by BoldMinded, which has Typekit and Google Fonts support built in via the settings screen.


5

Try using {site_url} which will return the site's homepage url such as http://www.mysite.com


4

Instead of modifying CK Editor files which would likely get nuked if you update the add on you are best to make a customConfig in the Editor Configurations. Change this and save this out to where you keep your front-end templates. var typkitID = 'XXXXXX'; CKEDITOR.on( 'instanceReady', function(ev) { var $script = document.createElement('script'...


4

As a small edition to this (and it's a great solution by the way!), when I need to do something like this ... rather then putting the CSS (or JS!) directly into the instructions field, I create a .css or .js file and then add the link to the instructions field: <script src="/assets/js/ee_cp.js"></script> or <link rel="stylesheet" type="...


4

This is quite simple, and why I prefer EE over other systems. It easily allows you to customize your markup anyway you want to. The {exp:search:simple_form} tag has two parameters to let you target and style the form with CSS (Docs). form_id & form_css. Re: placeholder text for the input, you can add the placeholder HTML5 attribute to the form. If you ...


4

You need to add a forward slash to your assets. Change this <link rel="stylesheet" href="assets/css/style.css"> to this <link rel="stylesheet" href="/assets/css/style.css">


4

While use cases for it are rare, CSS templates can parse tags if you need them to, but you must link to them with {path='template_group/css_template'} instead of {stylesheet='template_group/css_template}.


4

There is a version of Minimee that will run in EE3 - you need to get it from Github rather than Devotee, and I'm not sure it is an official release, but I can confirm it works fine. https://github.com/johndwells/Minimee/tree/version3 FWIW, it also appears to work OK in EE4 HTH


3

Because this isn't happening in your local development environment, I would guess it's not EE related but instead is caused by something on the server or is DNS related. But here are some things to try/check: Log out of EE, clear all cookies and cache, then log back in Disable extensions temporarily by adding this to your config.php file $conf['...


3

NB This P&T support thread seems to suggest that CKEditor (which is the editor WYGWAM is based should automatically strip <script> tags, so might be worth checking your themes/third_party/wygwam/lib/ckeditor/config.js file and asking on their Get Satisfaction if that isn't the case for you. That aside. even if you can do this in CKEditor, my ...


3

I have just spent many hours trying to resolve the very same issue, however, I was relunctant to upgrade PHP. On my production server, JavaScript was taking 5 seconds to load slowing down the responsiveness of every page within the control panel. However, the issue did not occur on my local (MAMP) server. I went through a process of disabling all the ...


3

EE won't parse tags that are stored outside of templates unless you do some trickery to send them back into the parser. Keep them in templates if you need the tags parsed. Though I should note that the parsing abilities for CSS and Javascript templates seem limited. While you are at it be sure to look into a minimizing module, this doesn't solve your ...


3

I spent some time trying to understand what happens on your code, until I notice the variable "{child_category_end}". This variable shows that the addon Laisvunas' Child Categories doesn't use the template class of EECMS, otherwise the variables would be something like "{child_category}(...){/child_category}". I can't say for sure without to read the code ...


3

It depends how your templates are put together, but in my case, I have a single embedded template which contains the overall layout so I would pass an embed variable e.g. {embed="layout" css_file="your_file"} and then in the layout template: {if embed:css_file}<link href="{embed:css_file}">{/if}


3

Chrome's Inspector should be your best-friend. Inspect the element (right-click on it and click "Inspect Element"), go to "Computed Style", find the height and toggle it down to see the source-file.


2

First step would be to make sure your browser isn't zoomed in on the text by resetting the zoom level. Here are FireFox instructions: http://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages If you want to inject custom CSS into the CP, you can use this CP CSS & JS extension to do so. Using your browser's inspect tool will help ...


2

Structure has a bunch of really useful global variables, which would make this even easier than using Stash or anything else really. Something like this: <link href="/assets/css/{structure:page:channel}.css" rel="stylesheet" /> or if the channel name is not a 1:1 relationship... {if structure:page:channel == "blue"}<link href="/assets/css/the-...


2

I'd avoid anything based on {site_url} and opt for relative paths instead. With what you've supplied, simply placing an "/" instead of {site_url} would suffice. That being said I would also avoid placing css in a template and do it the old fashioned way to stop this errant behaviour which also gives the added benefit of making solving any css issue, that ...


2

It doesn't work because if you omit the initial slash then the path is relative to the current page. The first slash basically says, "start from the site root". So no matter where you are within the filesystem the link "/assets/css/style.css" will always resolve to the correct place. If you are at "/mypage/something" and you call "assets/css/style.css" ...


Only top voted, non community-wiki answers of a minimum length are eligible