Community Forums › Forums › Archived Forums › Design Tips and Tricks › Subscription to newsletter not working properly
Tagged: minimum, subscription to newsletter
- This topic has 19 replies, 2 voices, and was last updated 12 years ago by
Cesc Vilanova.
-
AuthorPosts
-
November 30, 2012 at 2:46 am #2471
Cesc Vilanova
MemberHi,
I was trying to implement this in my site...
http://www.briangardner.com/email-newsletter-signup-box/
but even though I followed the tutorial step by step, I couldn't.
It only appeared a header and a text box at the end of each post, but not the "Subscribe" button nor the graphic assets I did upload.
I've disabled the widget until it looks and works ok.
Here you can see my Minimum 2.0. based blog:
http://cescvilanova.com/lo-que-haga-la-competencia-pero-6-meses-despues/¿Can you give me some clues to make it work?
Thanks a lot,
Cesc.
December 3, 2012 at 2:51 am #2969Cesc Vilanova
MemberHi again,
I couldn't make it work yet. Has someone had a similar problem?
Thanks again,
Cesc.
December 13, 2012 at 11:53 am #5000Kraft
MemberHi Cesc,
Can you reactive the widget so I can have a look at what it's doing (and not doing)?
Cheers,
Kraft
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 11:58 am #5001Kraft
MemberOne quick thing I noticed. You added the code from Step 2 to style.css-- that should be in functions.php. I can't see what's in your functions.php, so if you already added it there--great! Do remove it from style.css though. 🙂
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 4:34 pm #5066Cesc Vilanova
MemberThanks Kraft!
I've just:
1. Removed the unnecessary code from the style.css :p
2. Confirmed that the code required for the functions.php is in the file.
3. Reactivated the widget again.
The result is the same of the first time I tried to install it.
You can see how it looks here: http://cescvilanova.com/lo-que-haga-la-competencia-pero-6-meses-despues/
December 13, 2012 at 4:47 pm #5073Kraft
MemberHmm. I'm not seeing the code from Step 4 in your style.css. I applied it on my development end and it looks right. Can you verify that styling is in your style. css (and possibly empty your cache if you're using a caching plugin/host provider).
I'd also change the .enews-widget (the first section of the style in step 4) to say
margin: 25px 10%
or something similar to keep the widget from bumping too close to the meta above it.
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 5:01 pm #5076Cesc Vilanova
MemberHi!
I just added the code from step 4 (my mistake).
I've also adjusted the parameter of the margin and emptied the cache, but it looks the same. I'm probably missing something simple but I don't know what 🙂
Thanks.
December 13, 2012 at 5:25 pm #5082Kraft
MemberFound it. You pasted the Step 4 code just a line too early. Check out the code above what you pasted -- that's for when the screen is max-width of 300px.
You'll want to add a } just above what you pasted and remove the second } at the end of the file. That'll close the media query and get the enews styles active.
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 5:35 pm #5083Cesc Vilanova
MemberCorrected!
It now looks ok. The only think missing is the button to subscribe. I've checked the settings of the widget and everything seems ok.
December 13, 2012 at 5:42 pm #5087Kraft
MemberThe minimum theme purposely removes it, but you can get it back by removing around line 1236 of style.css.
Remove
.enews #subbutton, .searchsubmit {
display: none;
}Update: Rather, just remove the
.enews #subbutton,
part of that if you want to keep the search submit button hidden too.
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 5:55 pm #5092Cesc Vilanova
MemberOk. I would only need to adjust the color of the button and the space between the button and the text box, since they're too close from each other.
Which of these should I adjust?
.enews #subbox,
.s {
-moz-box-shadow: 0 0 5px #ccc inset;
-webkit-box-shadow: 0 0 5px #ccc inset;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 5px #ccc inset;
box-sizing: border-box;
color: #999;
font-family: 'Open Sans', sans-serif;
font-size: 12px;
padding: 15px;
text-transform: uppercase;
width: 90%;
}
#nav .searchform {
margin: 3px 0 0;
}
.searchsubmit {
display: none;
}
.enews p {
margin: 0 0 10px;
}December 13, 2012 at 7:06 pm #5116Kraft
MemberIf you use Firefox, you can install the Firebug add-on or with Chrome, you can right-click on something on page and click on "Inspect Element". I learned a lot of CSS by playing inside of Chrome's inspector.
Checking out the submit button, the styling code for that is at line 1797 of style.css (search for .enews #subbutton), the background-color is the grey currently. The "color" is the text color.
For the spacing, I'd add some margin to the right of the e-mail box. To the .enews #subbox settings, you can add: margin-right: 10px; (10 can be adjusted to whatever you want).
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 13, 2012 at 7:15 pm #5118Cesc Vilanova
MemberThanks for the tip about the inspector. I was using a similar option in Safari, but the one in Chrome is far better.
About the spacing, sorry, but I'm not getting it. This is how I have upated the css but nothing changes:
.enews #subbox,
.s {
-moz-box-shadow: 0 0 5px #ccc inset;
-webkit-box-shadow: 0 0 5px #ccc inset;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 5px #ccc inset;
box-sizing: border-box;
color: #534E4E;
font-family: 'Open Sans', sans-serif;
font-size: 12px;
padding: 15px;
text-transform: none;
width: 90%;
margin-right: 10px
}#nav .searchform {
margin: 10px 0 0;
}.searchsubmit {
display: none;
}.enews p {
margin: 0 0 10px;
}December 13, 2012 at 8:16 pm #5131Kraft
MemberLooks like you're missing the ending semicolon from the margin-right: 10px; line. Honestly not sure if that's enough to throw it off, but good chance it is!
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportDecember 14, 2012 at 3:15 am #5188Cesc Vilanova
MemberI've just added the semicolon but doesn't seem to work yet. This is the code of that part of the css right now:
.enews #subbox,
.s {
-moz-box-shadow: 0 0 5px #ccc inset;
-webkit-box-shadow: 0 0 5px #ccc inset;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 5px #ccc inset;
box-sizing: border-box;
color: #534E4E;
font-family: 'Open Sans', sans-serif;
font-size: 12px;
padding: 15px;
text-transform: none;
width: 90%;
margin-right: 10px;
}
#nav .searchform {
margin: 10px 0 0;
}
.searchsubmit {
display: none;
}
.enews p {
margin: 0 0 10px;
}February 4, 2013 at 6:36 am #17807Cesc Vilanova
MemberHi again!
I just changed my theme from Minimum to the new version of Genesis Theme.
Now that I've changed I'm having the same problem while configuring the newsletter box that I had last time: I don't see the button to subscribe.
I've tried the solution that Kraft provide me last time (removing
.enews #subbutton from the styles.css) but I don't find this code.
Am I doing something wrong?
This is the url of my site: http://www.cescvilanova.com
Thanks a lot!
Cesc.
February 4, 2013 at 12:20 pm #17935Kraft
MemberFirst, as a reminder, be sure to use a child theme for any modifications. To make the default Genesis theme a child theme, use this: http://www.studiopress.com/free-themes/sample
On the 1.9 default, they changed the way they hid the submit button from how they did it in Minimum.
At or about like 1136, you'll see
.enews input[type="submit"], .search-form input[type="submit"] {
with border 0, clip: rect(0,0,0,0), etc.If you want to get the submit button back for both the enews widget and the search feature (header right on the demo), remove that CSS section.
If you want just the .enews submit to return, remove
.enews input[type="submit"],
from that line.The simplest way to see how they hid it is check out the page using either Chrome's Developer Tools, Firebug or your tools of choice for your browser. You'll always see the submit button in the html code, so the corresponding CSS will show you the trick they used this time to hide it 🙂
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportFebruary 4, 2013 at 5:12 pm #18071Cesc Vilanova
MemberThank you very much Kraft.
The reminder was very appropriate. I didn't know I could use the sample as a child theme 🙂
I made a couple of changes in the parent theme (the ones required to install the newsletter box).
What can I do to restore the parent theme? It's ok if I download the parent theme again and install it overwriting the modified version?
Thanks again!
Cesc.
February 4, 2013 at 5:19 pm #18075Kraft
MemberYeah - you can download Genesis (parent) again and replace everything in your genesis folder, then remake the mods in the sample child theme.
For you or anyone else who stumble across this post, you don't want to edit the parent /genesis/ theme at all as when a new version of Genesis is released, all modifications would be lost on update. No good!
Brandon Kraft
Volunteer
Blog | Twitter
Genesis eNews Extended SupportFebruary 4, 2013 at 6:35 pm #18107Cesc Vilanova
MemberGreat. I could finally fix it 🙂
This is how it looks (I've also narrowed the wrapper):
http://cescvilanova.com/historia-de-una-idea-de-app-que-voy-a-guardar-en-la-nevera/
Thanks a lot for your help Kraft. Great support.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.