How can I style the submit button on the NMS module

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
User avatar
fearmydesign
Power Poster
Power Poster
Posts: 363
Joined: Sun Feb 28, 2010 10:54 pm

How can I style the submit button on the NMS module

Post by fearmydesign »

Hello everyone, I tried searching this forum but I couldn't find the answer. I want to know if there is a way to style the submit button that is on the NMS module (Newsletter made Simple), I can't seem to figure out how. I tried enclosing the {$submitbtn} in DIVs and giving it a class but it didn't work. Here is my styling code under the Submission template for the NMS. I appreciate your help. Please note on my code where I wrote ###THIS DIV DIDN'T WORK->>>>

Code: Select all

	{if $message ne ""}
	<br /><span class="nms_message">{$message}</span><br />
	{/if}
	{$formstart}
		{$formhidden}
<table class="ileanNMS">
<span style="font-size:18px; margin-left:auto; margin-right:auto;">Join our newsletter</span>
<tr>
        {if $prompt_email ne ""}
		<td>{$prompt_email}:</td>&nbsp;<td>{$email}</td></tr><br />
        {/if}
        {if $prompt_username ne ""}
                <tr><td>{$prompt_username}:</td>&nbsp;<td>{$username}</td></tr><br />
        {/if}</table>
		{foreach from=$listids item=curr_id}
		  {$curr_id}<br/>
		{/foreach}
		###THIS DIV DIDN'T WORK->>>>  <div class="submitNMS">{$submitbtn}</div>
	{$formend}
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: How can I style the submit button on the NMS module

Post by Dr.CSS »

Use the outline tool in the web dev. tool bar or look at the page source view to see what the submit button code looks like, good change it has a class of cms_submit, then you can target it, if you have more than one submit button you can go one level up to add the div class or ID to help target that button only, then using the edit css of the web dev. try giving it some css, most times buttons need border:none to make css work...

A link to the page with it on really helps in this board, as someone helping could go to the page and find these things for you...
User avatar
fearmydesign
Power Poster
Power Poster
Posts: 363
Joined: Sun Feb 28, 2010 10:54 pm

Re: How can I style the submit button on the NMS module

Post by fearmydesign »

Use the outline tool in the web dev. tool bar or look at the page source view to see what the submit button code looks like, good change it has a class of cms_submit, then you can target it, if you have more than one submit button you can go one level up to add the div class or ID to help target that button only, then using the edit css of the web dev. try giving it some css, most times buttons need border:none to make css work...
Thanks Dr., I had to think about everything you said for a minute... i didn't get it! But thank you, it worked. Just in case it may help someone else in the future determine the class:

open Firefox
make sure you have the web developer add-on installed
from this web developer menu bar select the Outline then select 'Outline current element'
this will open like another address bar below the web dev tools
simply move your mouse over the buttons or anything else on your page
you will see the results on this address bar

Thank you Dr.CSS
Post Reply

Return to “Layout and Design (CSS & HTML)”