I’m using the jetpack email subscription sidebar widget. I want to edit the CSS for the input field and submit button, and have tried to identify the relevant CSS class or ID using Firebug, but can’t for the life of me work out what they are called, or where the stylesheet is saved if it isn’t the standard stylesheet for the theme I’m using.
The Jetpack subscription widget doesn’t have a CSS file associated with it (as far as I can tell). The CSS elements are embedded into the PHP files.
Your best bet is to make the actual CSS changes to the <div> elements within the subscriptions.php file in the modules folder.
For instance, in the “// Check for subscription confirmation” I changed this:
<div style="background-color: #ee8b16; border: 1px solid #E6DB55; padding-left: 5px; padding-right: 5px; margin-bottom: 10px;">
<div style="background-color: #ffffff; color: #000000; border: 1px dotted #26201b; padding-left: 5px; padding-right: 5px; margin-bottom: 10px;">
The only difference being that during a plugin update, you may need to re-add it.
you can add your own CSS and only have to put the class names back in during an update
I just wanted to thank you for this answer. I was able to remove the styling and apply my own CSS tags. Now my subscribe form matches a little better. 🙂
Glad to help and thanks for the feedback. Now if we could get the thread resolved by the Admins….?
Just a quick question before you close this thread; how can I add my own CSS file?
Well, the jetpack modules has changed considerably over the past few months and should pull in the default site settings for most everything now. you should be able to change the default text settings here:
(starting line 650)
‘subscribe_text’ => __( ‘Enter your email address to subscribe to this blog and receive notifications of new posts by email.’, ‘jetpack’ ),
‘subscribe_button’ => __( ‘Subscribe’, ‘jetpack’ ),
‘subscribe_logged_in’ => __( ‘Click to subscribe to this blog and receive notifications of new posts by email.’, ‘jetpack’ ),
You shouldn’t however, have to change or add your own CSS but there’s lots of resources out there that can help you with the specifics.
Thanks for generously sharing this tip! It works great 🙂 Whew…
Thanks for the guidance but still stuck.
I have the latest version of Jetpack and cannot find the code your referring to with subscriptions.php
I have a big gap between the subscription widget title and the optional text and sign up field.
Where is the CSS code to fix the margin or padding between these areas?
Or do you know what font or h# it is using?
My other widgets are fine, just this one being an issue.
- The topic ‘[Plugin: Jetpack Subscription Widget] can't find css class or id's to edit’ is closed to new replies.