-
AuthorPosts
-
February 23, 2017 at 12:46 pm #750907
Hello Kriesi
This is what I’ve done
- Create a page called “Newsletter”
- Embedded a textblock
- Added a WordPress Jetpack shortcode to the textbox
- Page shows a form that allow visits to subscribe to my Blog
Problem is I want the form generated by the Jetpack Shortcode to use the Enfold Transparent Theme, rather than the default theme CSS.
I got the Transparent Theme to work with Contact Form 7 (CF7) by following the instructions here:
https://kriesi.at/support/topic/contact-form-7-styling-enfolds-light-transparent-color-scheme/
I just can’t get the CSS to work with the Jetpack shortcode.
Any help is appreciated.
Cheers
February 28, 2017 at 5:38 pm #753076Hey LordLiverpool,
try this code inside Quick CSS field:
#top .main_color .input-text, #top .main_color input[type='text'], #top .main_color input[type='input'], #top .main_color input[type='password'], #top .main_color input[type='email'], #top .main_color input[type='number'], #top .main_color input[type='url'], #top .main_color input[type='tel'], #top .main_color input[type='search'], #top .main_color textarea, #top .main_color select { background-color: tranparent; border-color: white; } #subscribe-text p { color: white; } .jetpack_subscription_widget h2.widgettitle { color: white; }
What else do you need?
Best regards,
AndyMarch 1, 2017 at 4:27 pm #753787Hi Andy
Thanks for replying!
I added your CSS to the Quick CSS and it did improve it a little.
See before and after images.
Before: https://snag.gy/UlzKZw.jpg
After: https://i.snag.gy/2OxIcv.jpg
I was expecting a transparent button and email field.
Can you please help?
Cheers
- This reply was modified 7 years, 8 months ago by LordLiverpool. Reason: malformed img tags
March 3, 2017 at 6:52 am #754840Hi,
Please try this instead:
.page-id-4640 input[type='email'] { background-color: transparent; border-color: white; } .page-id-4640 #subscribe-text p { color: white; } .page-id-4640 .jetpack_subscription_widget h2.widgettitle { color: white; }
Best regards,
RikardMarch 3, 2017 at 11:38 am #754981Hi Rikard
I replaced Andy’s CSS with your CSS via the Quick CSS Panel of Enfold Child > General Styling, but it made no difference.
Cheers
March 3, 2017 at 6:30 pm #755255Hi,
Please post us your login credentials (in the “private data” field), so we can take a look at your backend.
Login credentials include:
- The URL to the login screen.
- A valid username (with full administration capabilities).
- As well as a password for that username.
- permission to deactivate plugins if necessary.
Best regards,
AndyMarch 6, 2017 at 1:57 pm #756400Hi Andy
Thanks for replying
See Below
Thank you very much.
March 7, 2017 at 7:52 pm #757207Hi,
I added this code into your Quick CSS field:
#top .main_color .input-text, #top .main_color input[type='text'], #top .main_color input[type='input'], #top .main_color input[type='password'], #top .main_color input[type='email'], #top .main_color input[type='number'], #top .main_color input[type='url'], #top .main_color input[type='tel'], #top .main_color input[type='search'], #top .main_color textarea, #top .main_color select { border-color: white; background-color: transparent; } div#subscribe-text p { color: white; } .main_color .primary-background, .main_color .primary-background a, div .main_color .button, .main_color #submit, .main_color input[type='submit'], .main_color .small-preview:hover, .main_color .avia-menu-fx, .main_color .avia-menu-fx .avia-arrow, .main_color.iconbox_top .iconbox_icon, .main_color .iconbox_top a.iconbox_icon:hover, .main_color .avia-data-table th.avia-highlight-col, .main_color .avia-color-theme-color, .main_color .avia-color-theme-color:hover, .main_color .image-overlay .image-overlay-inside:before, .main_color .comment-count, .main_color .av_dropcap2, #top #wrap_all .main_color .av-menu-button-colored > a .avia-menu-text, .main_color .av-colored-style .av-countdown-cell-inner, .responsive #top .main_color .av-open-submenu.av-subnav-menu > li > a:hover, #top .main_color .av-open-submenu.av-subnav-menu li > ul a:hover { background-color: transparent; border: 1px solid white; }
and not it seems to work fine for me: http://i.imgur.com/XgsTY7L.png
Can you confirm please?Best regards,
AndyMarch 7, 2017 at 11:09 pm #757334Hi Andy
That’s looking great, sorry just one final thing,
Can you please tell me how do to fix the button hover so it stays transparent and not turn blue of the Enfold theme.
Cheers
March 8, 2017 at 5:30 pm #757928Hi,
sure, use this code:
.main_color .button:hover, .main_color .ajax_controlls a:hover, .main_color #submit:hover, .main_color .big_button:hover, .main_color .contentSlideControlls a:hover, .main_color #submit:hover, .main_color input[type='submit']:hover { background-color: transparent; border-color: white; }
Best regards,
AndyMarch 8, 2017 at 5:58 pm #757960Thanks Andy that worked perfectly!
Thanks very much! :-)
March 8, 2017 at 6:02 pm #757968I’ve just made a new feature request for this functionality.
https://kriesi.at/support/enfold-feature-requests/
Cheers
March 10, 2017 at 6:44 am #758697 -
AuthorPosts
- You must be logged in to reply to this topic.