How to Style the MailPress Subscription Widget

By default, the MailPress subscription widget looks pretty crude, because it has no styling. To make it look nice like the one on BuildYourBlog.net, you need to add some rules to the style.css file in your theme. Start by creating a child theme, if you haven't already done so. Then add these rules to your child theme's style.css:

/* Center the MailPress subscription form */
.MailPress { text-align: center; }

/* Widen the subscription form boxes, and put space between them */
.MailPressFormEmail, .MailPressFormName {
 width: 190px;
 margin: 5px 0;
}

There is no field in the widget for adding a friendly message inviting your visitors to subscribe, but you can do this by adding:

/* Add a friendly invitation to the top of the MailPress signup form */
.MailPress:before { content: "Enter your Email and Name to Subscribe
to my Free Newsletter:" }

These styles will also effect forms created with the [[mailpress]] shortcode, so your friendly invite will appear there as well; which may not be what you want. I haven't worked out how to avoid that yet.

Liked this post? Subscribe to get more like it via email.

About Graham

I'm the creator of BuildYourBlog.net.
This entry was posted in MailPress and tagged , . Bookmark the permalink.

One Response to How to Style the MailPress Subscription Widget

  1. Jens Skovgaard says:

    Thank you! Just what I was looking for. Do you also know how to change the font-family in the subscription field?

Comments are closed.