Community Forums › Forums › Archived Forums › Design Tips and Tricks › Customizing MailPoet Subscriber Box
- This topic has 25 replies, 8 voices, and was last updated 8 years ago by mythuat24h.
-
AuthorPosts
-
April 8, 2016 at 11:25 pm #183196anewcreationParticipant
Hi Everyone, I've been trying for 2 hours to figure out or find code that I can place in my stylesheet that will change the background color, the font color, and the width of my MailPoet subscriber box that is in the side bar. I haven't been able to make it work. Has anyone else done this, if so, can you share the code that I would place in my stylesheet.
Thanks so much for your time.
Jeanne
http://hspmentor.com/April 9, 2016 at 4:52 am #183205Victor FontModeratorYou would create a style block for #wysija-2.
#wysija-2 { background-color: #ff0000; color: #000000; }
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 9, 2016 at 9:29 am #183213anewcreationParticipantHi Victor, Thank you so much for your post. I copy and pasted your code and placed it at the bottom of my style.css file, but for some reason, there was no change at all in the subscriber box. Jeanne
April 9, 2016 at 9:48 am #183216jlknauffMemberJeanne,
Try this instead:
.widget_wysija { background-color: #ff0000; color: #000000; }
April 9, 2016 at 10:00 am #183217anewcreationParticipantHi jlknauff, Thanks for looking into things. I copy and pasted the additional code you sent, there was still know change though. I appreciate that you tried. Jeanne
April 9, 2016 at 10:07 am #183218jlknauffMemberDo you have a caching plugin? If so, flush your cache, and do a hard refresh (ctrl + f5)
April 9, 2016 at 10:44 am #183220anewcreationParticipantHI,
Whoops...embarrassing typo in last post, I meant to write "no change"! I tried clearing the cache and also restarted my computer, but there was still no change. Are you seeing a change on your computer? Here is a screenshot of what I'm viewing.
April 9, 2016 at 1:09 pm #183222jlknauffMemberAre you sure you're editing the right file? I tried the changes that both Victor and I recommended and it changes the area you're trying to change.
(Right click to inspect in Chrome or with the Firebug extension in Firefox to see changes live in real time.)
April 9, 2016 at 1:52 pm #183224anewcreationParticipantHi, It does seem like something strange like that is going on. It's odd that nothing is changing the design of the form. Here is screenshot so you can see the file I'm editing and the code that was placed. I really appreciate the fact that you are taking time out to look at my posts, thank you.
April 9, 2016 at 4:53 pm #183229jlknauffMemberHmmm...if you're changing the correct CSS, it definitely should change on the front end.
Try this...
.widget .widget_wysija
If that doesn't work, and if you don't mind a stranger poking around in there, I can log in and take a look tomorrow.
April 9, 2016 at 6:12 pm #183233blitzgeekMemberI tried to edit in the Browser and it worked like a charm.
`/* MailPoet
--------------------------------------------- */
.widget_wysija {
background-color: #000000;
color: #fff;
}
.widget-title {
color: #64c9ea;
}April 9, 2016 at 10:45 pm #183240anewcreationParticipantHi jlknauff, Thanks so much for offering to look around on my site to see if you can figure out the problem. Unfortunately, the owner of the site didn't want me to do that.
I did a few tests. I edited something else in that same style.css file, the main website nav background color, and it changed. I wanted to make sure it wasn't the css file itself. So that eliminated that.
Yesterday, I was grabbing code from the internet and trying it on the mailpoet form, and one bit of code changed the submit button color. I deleted it since I didn't want that color, just testing. Today I tried that same code, and it didn't change anything. I wonder why it would change yesterday and not change today.
Thanks again for your time.
Jeanne
April 10, 2016 at 6:59 am #183254Brad DaltonParticipantI think you can use the Genesis eNews Subscribe widget with MailPoet which should be easier to style.
April 10, 2016 at 8:23 am #183258ChristophMemberIf you add code at the bottom of the style.css, make sure you are not writing it inside of a media query ( like you did in the screen shot above).
April 10, 2016 at 8:32 am #183261blitzgeekMemberI don't know, why my screenshot above doesn't appear.
But i placed the code into line 990 and it worked without problems (done in Browser)April 10, 2016 at 10:32 am #183269anewcreationParticipantHi Christoph,
Just making sure, your talking about the screenshot above that has the purple boxes around the code, right? I'm not sure what "not writing it inside of a media query" means. Can you explain this so I can change it. Thanks so much for your help!!!
Jeanne : )
April 10, 2016 at 11:02 am #183272ChristophMemberHi Jeanne,
yes, that´s what I´m talking about.
The structure of media queries is
@media... { all of your css code for that screen size }
You placed the code inside of @media only screen and (max-width: 270px) {
The closing bracket } above your code is for .site-title not the media query.
Place your code outside of the media query or even better don't write code at the bottom of the style.css
April 10, 2016 at 11:25 am #183273anewcreationParticipantHi Christoph,
Thanks for the info. I see what you are talking about now. Funny things is I didn't write the code that mentions the max-width of 270, it was already there when I opened the stye sheet. It didn't have anything to do with the MailPoet form so I didn't pay attention to it. I only added the part in the purple box. Thanks for pointing that out , your right, it doesn't look correct.
I also tried deleting the mailpoet plugin and reinstalling it, and that didn't work either.
Thanks for the information and tips.
Jeanne
April 10, 2016 at 2:32 pm #183306anewcreationParticipantThis reply has been marked as private.April 10, 2016 at 6:39 pm #183323jlknauffMemberChristoph, shit, I'm 99% sure you just hit the nail on the head. 😉
-
AuthorPosts
- The topic ‘Customizing MailPoet Subscriber Box’ is closed to new replies.