Posted: July 1, 2013 at 12:28 pm
|
|
Hi, guys, my client is using the Responsive theme from Cyber Chimps but the EE plugins look terrible as they don’t pick up the theme’s colours or fonts. I know there is a workaround but do you know if any (specific) responsive themes work well with EE and allow custom colours and fonts without messing about with Javascript? My client has invested a lot of money in EE with quite a few plugins and while it works really well, it looks atrocious! You must know which one’s work well, particularly for mobiles. So many are chargeable so just trying them out is seldom an option! Thanks guys! |
|
Hi Neil, I installed a copy of Responsive on a test site and it turns out that the Event Espresso pages does pick up the theme’s colors and fonts. The exception to this would be the case if the themeroller option is turned on in Event Espresso>Template settings though. If the themeroller option is turned on it will override the Responsive theme’s styles. You can customize themeroller to use the Responsive theme’s colors and fonts if you want to use Themeroller -and- match Repsonsive’s colors and fonts: https://eventespresso.com/wiki/how-to-create-custom-themeroller-styles/ Responsive uses a lot of #0066cc (blue) for its links, as well as a few shades of gray for its menus and text like #585858, #444444. As an aside, any WP theme can be customized without using Javascript. In most cases CSS will do the trick. You might try the my custom CSS plugin if you’re not going to use a child theme to add custom styles. |
|
|
|
Thanks Josh, I use WordPress a lot and always use a child theme with its own stylesheet which I customise. that lets me upgrade themes whenever a new one comes out and retain my styling. the WordPress way! I’ve never had to recourse to Java to simply get a plugin to pick up styles. What happens if a client changes a theme? Changing themes should be a non technical user-available option. Plugins that impose a rigid set of colours? What about branding? Plugins should by default use the theme’s styles – never impose their own. That’s just wrong on all levels. My client had tried to change his colours and found his EE stuff became unreadable. Are you saying I can set EE up to follow branding colours automatically or do I need to risk Java clashes and non-functional plugins by running Java just to change from #eee to#222 and a font from Verdana to a webfont like Ubuntu Condensed? |
|
Hi Neil, I am sorry for any confusion here. I will try to clarify things a bit below each of your responses below:
I am not saying one would need to or even should use Java, or JavaScript to get a plugin to pick up styles. In its default state, Event Espresso will allow the theme’s colors to display the colors set by WP theme’s stylesheets. For example, the responsive theme sets link colors to #0066cc (blue). If you look at the registration page with the Responsive theme active, the link colors are #0066cc (blue). Event Espresso lets the theme’s colors display without getting in the way.
This is a user-available option in Event Espresso>Template settings under Themeroller options. There are 26 color schemes to choose from.
Not sure what you mean by this. Can you point to an example where Event Espresso imposes a rigid set of colors by default? By default Event Espresso doesn’t include much in the way of styles, it lets the WP theme style the page elements
Can you let us know what they changed that made the Event Espresso stuff unreadable?
Yes, Event Espresso will get out of the way by default. If a theme styles the a element (usually links are marked up with the a element) links on the registration page will be styled as specified by the theme’s stylesheet. The same is true for background colors, form elements, and general page elements like p’s and div’s.
No where do I mention using Java, or JavaScript for that matter to change colors on a theme. The options jQuery themeroller themes that are included with Event Espresso do not use JavaScript. They are a set of stylesheets (all CSS) that you can choose from. However, in the case of changing a color of a specific element that is currently #eee you’d add something like this to your child theme: element { Webfonts like Ubuntu Condensed are a bit different because in most cases Ubuntu Condensed is not installed on most systems (if they’re not running Ubuntu, they probably don’t have Ubuntu Condensed. However, the Google Font API has non-JavaScript options to load Ubuntu Condensed onto your web pages: http://www.google.com/fonts#UsePlace:use/Collection:Ubuntu+Condensed |
|
|
|
Hi, Josh, we may be at cross purposes here, but I really do appreciate your help. When I create a WordPress site, I install a theme that’s close to what my client wants his site to look like, then add a child theme to let me customise CSS styles (style.css) and to add extra functions as required (functions.php) and maybe create custom page templates or extra sidebars, etc. That will always involve changing colours, sizes of containers, heading styles and also fonts. Life is complicated too by the fact everything I do is now responsive to it works across devices. When I add a plugin, I expect that plugin to out of the box, comply with the same standard core WP elements – like h1 to h6, p, background, text colours, highlights, a tags, etc. This is important because only a few well written plugins like Gravity Forms, for example, allow styling from the main site or child theme’s stylesheet. The beauty of WordPress is the ability to choose from the amazing range of themes available. When a theme is changed, its reasonable to expect that whatever Widgets and plugins follow the new styles in terms of colours and fonts and other standard elements. That way everything retains an integrated look and feel and looks professional. I add webfonts rather than native fonts as that allows the site to retain the same typography across browsers and operating systems – so my site looks the same, with the same layout and line breaks no matter if its Windows, Mac or Linux, and on whatever device, desktop, tablet or phone. And yes, Ubuntu Condensed (a cool font for small sizes) is a webfont from Google. http://www.google.com/fonts/specimen/Ubuntu+Condensed I just add the necessary line to header.php, declare the style in CSS and its sorted. If I want to change the font, I add a new one. Simple. What I can’t seem to explain is that when I style a theme like CC’s Responsive from a basic white background to a dark (#222), your plugins insist on keeping their own styling. That may be a white background or worse, dark text that gets lost on the new dark background. Its not about having the choice of some similar colours in the plugin set-up, but having compliance with the site’s theme style. I didn’t set any ThemeRoller options (why should I have to?), but out of the box, EE was unusable on anything other than a white vanilla theme. The fonts were unreadable, the size too small and blurry making the layout stand out like something out of 1999! I guess what I’m asking is “can EE just take whatever is in the site’s own CSS for its colours and fonts?” Or do I have to accept the colours and fonts you think I should have, or be prepared to waste time and my client’s money rolling my own? The site in question is boxoffice.eevee.co.uk. |
|
|
Hi, “I guess what I’m asking is “can EE just take whatever is in the site’s own CSS for its colours and fonts?”” By default Themeroller is turned on to help provide a nice look with no effort. If you head over to Event Espresso > Template Settings in the WordPress dashboard, you can set “Use Themeroller Style Sheets” to No. This will turn off Themeroller. Our espresso_default.css will still be active, but it is an extremely basic style sheet, mainly structural, similar in a way to Graivty forms basic stylesheet. Any style you do not like, can be over ruled from your themes style.css file. If you leave themeroller on, you can still over rule Themeroller styles from a themes style.css file. |
The support post ‘Recommended themes to support element styles’ is closed to new replies.
Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.
