Yes in your styles add:
.awesome-weather-wrap { background: rgba(255,255,255,0.4); }
This can help: http://hex2rgba.devoth.com/
Thread Starter
Blake
(@alexanderblake)
I added
background: rgba(255,255,255,0);
In place of the .awesome-weather-wrap {
background: #333;
It didn’t seem to make a difference. The widget it still pink. So I left it in the plugin’s .css file, and put #333 in the widget itself because it’s closest to the footer color.
http://rockwalldowntown.com – you can see the grid pattern I’m trying to achieve. Transparency would be easier because the image URL for it just ends up being basically solid #333 colored anyway.
What am I missing?
Thanks, by the way!
You may have to make the selector a bit more specific so it takes precedence. Try this:
#second .awesome-weather-wrap { background: rgba(255,255,255,0); }
I just did a test with Inspect Element and when you achieve this look it’s going to look great! Let me know if the above works, if not we’ll figure it out!
Thread Starter
Blake
(@alexanderblake)
Awesome!! It worked like a charm and look AWESOME. Now I can install it in my other sites with and without transparency. BOOM.
Thank you!
Hi,
I would like to achieve the same purpose. Where should I put #second .awesome-weather-wrap { background: rgba(255,255,255,0); } ?
Thanks !
Great plugin !
This should be added to the ‘style.css’ file found in your theme.
/wp-content/themes/YOUR-THEME-NAME/style.css
This is a great plugin! love it, quick question is it possible to put this in a slider?
If your slider has the ability to include shortcodes than yes. Here is a shortcode example:
[awesome-weather location="Montreal" units="F" size="tall" override_title="MTL" forecast_days="2" hide_stats=1 background="http://urltoanimage.jpg" custom_bg_color="#cccccc" inline_style="width: 200px; margin: 20px; float: left;"]
