10 {{ upvoteCount | shortNum }}
10 {{ upvoteCount | shortNum }}

I need some "custom" buttons made for the AutoResponder I am using. How do I do that?

by webguycanada
8 replies
  • WEB DESIGN
    • |
Hi guys!

I am using ListAnimal.com autoresponder service.

Presently, they only have 1 style of submit button: (see image below)



I can change the text inside of the button, which is great,
but... I don't have any idea how to change the LOOK or STYLE
of the button.

I want to be able to create BIG COLORFUL BUTTONS!!!

Here are some notes regarding 3rd party integration:
» Third Party Integration ListAnimal – Setup & Operational Help

but I am not a web designer nor CSS designer guy,
so I am am not sure what I need to do. ???

Can anyone offer some good advice?

Thank you in advance!

Craig.
#autoresponder #buttons #custom #made
  • Profile picture of the author David V
    Never heard of listanimal, but it should be similar at least to other services. If your creating your autoresponder inside their website then using their javascript or code to feed the form to your website, then you can only modify the button within their/your member panel.

    If you just grab the raw html code for the autoresponder form, then you can change the button to anything you want. However, doing it that way will require a little code manipulation.

    For example, if I grab the html form code from aweber, here is the button input that I've modified.
    Code:
    <input class="bigbutton1" id="submit-button" type="image" src="img/big-button.png" name="submit" value="Get Instant Access">
    {{ DiscussionBoard.errors[7747540].message }}
  • Profile picture of the author webguycanada
    Thank you for helping me out David!

    Here is the HTML code that ListAnimal gives me to paste into my website.
    The only thing I have change below, is the "list id = number" to prevent other people
    from seeing it here in the forum.

    So what you are saying is, that I can change some of this code below in order to make a nice BIG COLORFUL BUTTON... ??? (and I am assuming I have to have an image of the button I want to use hosted on my server as well..... correct?)

    Please advise.

    Thank you again!

    Craig.

    <div id="form">
    <form action="https://register.listanimal.com/forms/?listid=0X0X" method="post" name="optin" id="optin" onsubmit="return required();">
    <label>First Name:</label><br>
    <input type="text" name="name" value="" style="width:90%;">
    <br><br>
    <label>Email:</label><br>
    <input type="text" name="email" value="" style="width:90%;"><br>
    <br>
    <input type="hidden" name="lid" value="305">
    <input type="submit" value="Give Me Access Now !"><br><br>
    </form>
    </div>
    {{ DiscussionBoard.errors[7747792].message }}
    • Profile picture of the author David V
      Originally Posted by CraigJones View Post

      So what you are saying is, that I can change some of this code below in order to make a nice BIG COLORFUL BUTTON... ??? (and I am assuming I have to have an image of the button I want to use hosted on my server as well..... correct?)
      Basically yes.
      Change the input type to image.
      You'll need to likely apply a class so you can apply styling/padding/etc...to the button like the example input I gave you.
      I would dig into the listanimal docs if you can, it would make sense they would talk about custom buttons.

      P.S. It could be very helpful to find another site that has a button you like, then view their source code and you can also see their input button and how it was done.
      {{ DiscussionBoard.errors[7747809].message }}
  • Profile picture of the author webguycanada
    Thanks again David for your help!

    Believe it or not, ListAnimal does not have any docs that talk about Customizing the Buttons.
    {{ DiscussionBoard.errors[7747827].message }}
  • Profile picture of the author David V
    Well, you have the raw html code, so you can change that button however you like.
    Have you considered a better autoresponder? Mailchimp is free (up to 2000).
    {{ DiscussionBoard.errors[7747854].message }}
  • Profile picture of the author webguycanada
    Thanks David...
    I am VERY HAPPY TO HEAR: QUOTE:
    "Well, you have the raw html code, so you can change that button however you like."

    As an early beta-test buyer, I paid a LifeTime Fee for ListAnimal,
    so I want to at least get some use out of it. But I found that the "single" button style
    that they offer presently... is GARBAGE. :-(

    If I do set up another auto-responder, I'll stick with aweber or getresponse.

    Craig
    {{ DiscussionBoard.errors[7747877].message }}
  • Profile picture of the author MrMonetize
    Adding on from Davids post which didn't quite explain it, just apply a style class to the button's html, its easy.

    <div id="form">
    <form action="https://register.listanimal.com/forms/?listid=0X0X" method="post" name="optin" id="optin" onsubmit="return required();">
    <label>First Name:</label><br>
    <input type="text" name="name" value="" style="width:90%;">
    <br><br>
    <label>Email:</label><br>
    <input type="text" name="email" value="" style="width:90%;"><br>
    <br>
    <input type="hidden" name="lid" value="305">
    <input type="submit" value="Give Me Access Now !" class="submitbutton"><br><br>
    </form>
    </div>

    then in your CSS file, add the following:

    .submitbutton {
    width:120px;
    height:30px;
    padding:5px 10px 5px 10px;
    color:#000;
    border: 1px solid #000;
    background:#BADA55;
    font-size:14px;
    }

    Just change/delete these variables or add more to suit your needs.
    {{ DiscussionBoard.errors[7814614].message }}

Trending Topics