WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [Plugin: Jetpack Subscription Widget] can't find css class or id's to edit (9 posts)

  1. fishgun
    Member
    Posted 2 years ago #

    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.

    http://padfader.com

  2. tjohare
    Member
    Posted 2 years ago #

    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;">

    to this:
    <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.

    -OR-
    you can add your own CSS and only have to put the class names back in during an update

  3. Lauren
    Member
    Posted 2 years ago #

    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. :)

  4. tjohare
    Member
    Posted 2 years ago #

    Glad to help and thanks for the feedback. Now if we could get the thread resolved by the Admins....?

  5. Alex
    Member
    Posted 1 year ago #

    Just a quick question before you close this thread; how can I add my own CSS file?

  6. tjohare
    Member
    Posted 1 year ago #

    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.

  7. Alex
    Member
    Posted 1 year ago #

    Okay, thanks for the info.

  8. judyasman
    Member
    Posted 1 year ago #

    Thanks for generously sharing this tip! It works great :) Whew...

  9. simon.wynne
    Member
    Posted 1 year ago #

    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.

    Many thanks,

    Simon

Topic Closed

This topic has been closed to new replies.

About this Topic