Interesting in using jetpack subscription widget

You should be able to customize the look of the form with CSS to match the Feedburner widget’s style. You can add that CSS to your theme stylesheet, or to your custom CSS editor available under Appearance > Edit CSS in your dashboard.

If you’re not comfortable writing this CSS on your own, I’d be happy to tell you what code to use, but I would need you to add the widget to your sidebar again so I can test my CSS changes.

Thanks!

Hi Jeremy, first thank you so much. I will select the option #2 since I don’t have a lot of experience with CSS coding lang.

I will add the widget now and tell me what to do. Thanks again really appreciate it.

We can do it through this post page or here whatever you prefer [link], specially made for Jetpack.

Something like this should do the trick:

.sidebar .jetpack_subscription_widget form {
  margin: 0;
  width: 261px;
  padding: 5px 15px;
  float: left;
  border: 1px solid #bfbfbf;
  border-top: transparent;
  border-bottom: transparent;
  background: #FFF;
  margin-left: 5px;
}

.sidebar .jetpack_subscription_widget #subscribe-text {
	text-align: center;
}

.sidebar .jetpack_subscription_widget input[type="submit"] {
	margin: 0 80px;
}

.sidebar .jetpack_subscription_widget #subscribe-email input[type="email"] {
  background: url(https://www.jumzler.com/wp-content/themes/caresland-lite/images/input-bg.png);
  width: 241px;
  height: 21px;
  border: none;
  box-shadow: none;
  background-repeat: no-repeat;
  color: #292929;
  font-size: 14px;
  font-family: 'Scada', sans-serif;
  padding: 13px 10px 7px;
}

You can paste that code at the end of your theme stylesheet, or in your custom CSS editor.

I hope this helps.

… editing ??

Thanks it works very well for the desktop. But, can we make it work for mobiles too? perhaps a responsive widget form. I tested it and here a screen shot [link]. Also, you can test it directly through any mobile device. So, can we make it work for mobiles and different scrren sizes too?

Things seem to look good on my iPhone and my iPad.

If things don’t look too good on your end, I’d suggest using CSS Media Queries to change the look of the form in your screen resolution.

You can read more about it here:
https://css-tricks.com/css-media-queries/

If you’re not sure how to do this yourself, I’d suggest posting in CSS forums to get help:
https://css-tricks.com/forums/

To be honest with you, I’m still a newbie in coding. I gave it and still give an hour every day since I’ve other things to do, started about 40 days ago. So, I don’t have the full experience to edit and I don’t want to break the walkthrough of learning how to code.

Also, I love perfect things. The theme toke a full month from me to change and edit things until I finished it (about 300 hours) and it’s not completely done. But, nothing is broken inside.

I really appreciate your efforts in the code, and in checking the widget and giving me some of your time. And, I wish you think about including this feature “a responsive form” in a next, later update.

Thank you ??