Views: 2827
How to make a popup subscribe form for phplists in WordPress
A client asked me to install a popup form that will appear when a new user opens their web site. here is step by step what I did.
- The following assumes that you already have phplists and wordpress already installed. You can use this as inspiration to put any form in a popup. I plan to do it for a client using mailchimp.
- First you need to have the built in phplists subscribe form look the way that you like it.
- You make the default subscribe form by clicking opening
- http://yoursite.org/lists/admin/?page=home
- Select “Configure subscribe pages”
- Over here build your subscribe page the way you like whether it has several lists or just one.
- Then go back http://yoursite.org/lists/admin/?page=home and go into “configure phplist” and make sure you have yes selected for “if there is only one visible list, should it be hidden in the page and automatically subscribe users who sign up”
- After you are satisfied with how the form looks and acts open the “page source” and copy the whole page into your favorite editor. I used Bluefish.
- add the following code to the <form><form method=”post” action=”http:/mysite.com/lists/?p=subscribe” name=”subscribeform”> adding the action between the post and name= . Change the code to reflect your own web site URL, otherwise nothing happens when you press the subscribe button.
- In order to keep visitors at my site I adjusted the <form> more so that the phplists confirmation appears in a new window by adding before the closing pointy brackettarget=”windowName” onsubmit=”window.open(”, this.target,
‘dialog,modal,scrollbars=no,resizable=no,width=550,height=500,left=0,top=0’);” - Then edit the code in your text editor, especially by removing the css classes that are called that you dont have. make your html page look exactly the way you want. I removed the unsubscribe option and the phplists image and link from this subscribe page, but certainly leave them at the phplists script on my site.
- After you made it simple you can spruce it up in the WordPress editor window where you will edit the popup. It supports full wordpress editing.
Stage Two
- Then install and activate the WordPress Popup Plugin
- in “Pop Overs” settings select use “external load”
- Now make a new Pop Over copy your html code from your text editor, from below <body> to the end of the </body> and paste it into the text option of the Pop Overs editor (text option seems to be the default)
- Save and activate it
- You will need to change some the settings in edit pop Over window. You can adjust things like height in with reference to the top and left as well height, width, width of borders. I selected the “lightbox” style that greys out the rest of the page.
- Now you have an annoying popup!
- You can adjust the annoyingness by selecting the options on the side of each popover
- You can apply or not apply different popovers to different pages and can determine what pop over to show users depending on how they showed up at your site. For the beginning I set it to show up 3 times for each visitor, though 2 might be enough and for it to only appear after 4 seconds.
I think that I might add the popup to this blog too.
I followed the directions from: http://docs.phplist.com/CustomSubscribeForm.html?phrase=subscribe+page
I also used the WordPress Popup Plugin
You can see the results at http://milknhoney.co.il/think/
The funniest part of this is that 30 years ago I used to demonstrate and Sell popover kitchenware at Macys