How to add landing page templates to wordpress?

11 years ago

Ok I figured out how to have the template,called "freshsqueeze", appear in the dropdown menu by adding this:
<?php
/*
Template Name: freshsqueeze
*/
?>

to the index.html file and then renaming that file to freshsqueeze.php.

My problem now is that when I view the webpage, the images and css don't appear to be working. Maybe I'm not linking them properly?

I've uploaded a folder called "freshsqueeze" to the main folder in the twentytwelve theme using filezilla. That folder (freshsqueeze) contains an images folder, a css folder which contains a freshsqueeze.css file, a folder called "PNG and PSD", and a freshsqueeze.php file.

What am I doing wrong?
Thanks
Any suggestions?

Thanks

{{ DiscussionBoard.errors[8019626].message }}

RobinInTexas

11 years ago

Are you trying to create a theme or a template?

If you want to create a template, check out my blog post:

http://www.warriorforum.com/blogs/ro...wordpress.html

Thanks
1 reply

Signature

Robin

...Even if you're on the right track, you'll get run over if you just set there.

{{ DiscussionBoard.errors[8019660].message }}

WarGasm

11 years ago

Originally Posted by RobinInTexas

Are you trying to create a theme or a template?

If you want to create a template, check out my blog post:

http://www.warriorforum.com/blogs/ro...wordpress.html

Its a template I'm trying to install within a pre existing theme. I followed the code you suggested but am receiving this error message when I pull up the page: Parse error: syntax error, unexpected '<' in /home/worknman/public_html/wp-content/themes/twentytwelve/freshsqueeze/freshsqueeze.php on line 6

My freshsqueeze.php file looks like this:

<?php
/*
Template Name: freshsqueeze
*/
//
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FreshSqueeze Affiliate Marketing Template</title>
<link href="css/freshsqueezestyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="header">

<div id="offertext">Kiss your under-performing squeeze page good-bye!</div>
<div id="freedownload"><a href="http://www.justdreamweaver.com/templates/freshsqueeze/freshsqueeze.zip">FREE<br />
DOWNLOAD</a></div>

</div>
<div id="wrap">
<div id="mainContent">
<h1><span class="black">Your squeeze page called and wants you to pick up some </span><span class="underline">FreshSqueeze!</span></h1>
<h2>Do your conversion rate a favor
and <span class="red"><br />
download this template!</span></h2>
<p class="center">Are you using one of those squeeze page generators that ouput the same crappy pages as everyone else? <strong>You're doing yourself more harm than good!</strong></p>
<p class="center">Why do you want your money page to look like it was <strong class="yellow-highlight">designed by a kindergartner?</strong> <span class="smalltext"><br />
(no offense intended to my 6-year old)</span> </p>
<h2 align="center"><span class="black">We say</span> <span class="redunderline">NO</span> to <span class="red">UGLY</span> affiliate pages!</h2>
<p align="center">We're all tired of seeing the <strong>SAME PAGE</strong> over and over again! <br />
<strong>Sure all the affiliate "gurus" tell you they convert well. </strong><br />
It's because they're probably selling you the squeeze page software! <strong>Hello!?!</strong></p>
<p align="center"> </p>
<h3 class="greybox">We're going to <strong>give</strong> you something that will <span class="yellow-highlight">drastically change</span><br />
the way your squeeze and landing pages <span class="underline">convert!</span> <br />
<br />
KEEP READING FOR A <span class="redunderline">LIFE-CHANGING</span> OFFER!</h3>
<p> </p>
<h3 class="red">Read what our happy customers have to say!</h3>
<blockquote> I'm so happy with this free template that I almost wet my pants! I got <strong>over 1,000,000 opt-in addresses</strong> in less than <strong>two hours!</strong> My host server shut off my account and I have more Viagra and Cialis URLs than you can shake a stick at! Thanks!<br />
<div class="blockquotesig"><em>Johnny Doe</em><br />
<a href="#">NotRealIntelligent.com</a></div>
</blockquote>
<blockquote> After I downloaded and customized your cool affiliate marketing template, I not only won the lottery, but my dog that died 6 years ago showed up at my doorstep! I can't believe how my life has changed!<br />
<div class="blockquotesig"><em>Jim Slim</em><br />
<a href="#">ImJohnnysCousin.com</a></div>
</blockquote>
<p class="center">You can see the power of putting our <strong>FreshSqueeze template</strong> to work for you! Now you too can have the power to bring long-lost pets back into your life!</p>
<div class="offercouponoutline">
<div class="offercoupon">
<form id="form1" name="form1" method="post" action="http://www.justdreamweaver.com/templates/freshsqueeze/freshsqueeze.zip">
<p>
<input type="checkbox" name="checkbox" id="checkbox" />
<span class="red">YES!</span> Please send me the template!</p>
<p>You made the right choice! Now you're on your way to converting MORE visitors, building a BIGGER email list and making MORE MONEY on the internet!</p>
<input name="submit" type="image" src="images/coupon-button.gif" value="Download Now!"/>
</form>
</div>
</div>
<h2>This is why <span class="redunderline">you can't live without</span> this template!</h2>
<table width="550" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="193"><a href="#"><img src="images/sample2.gif" /></a></td>
<td width="300" valign="top"><div class="checkmarks">
<p>Professional template design</p>
<p>Increases conversion</p>
<p>Doesn't make you look cheap</p>
<p>You get all these cool graphics</p>
<p>Easily customized appearance</p>
<p>It's all <span class="red">FREE!</span></p>
</div></td>
</tr>
</table>
<p> </p>
<div class="shadowbox">
<div class="sbcontent">
<h1>Act NOW! <span class="black">Only </span><span class="lineout">139</span> <span class="lineout">27</span><span class="black"> 6 left!</span></h1>
<p>Are we telling the truth? <strong>You'll never know!</strong> But that's not the point!</p>
<p>Our <strong>free squeeze page template</strong> gives you all these cool boxes and styles already coded for you! All you need to do is insert your content, throw a few pictures in, put in your affiliate links and fire up the AdWords campaign! Then just sit back and <br />
<span class="yellow-highlight">WATCH THE MONEY ROLL IN!</span></p>
</div>
<div class="sbshadow"></div>
</div>
<p class="left">We're so confident that by using this template you'll not only <strong>improve your conversion and opt-in rate</strong>, that we'll give you a <span class="yellow-highlight">200% REFUND</span> of the purchase price!

That's right! If you don't see instant improvement in your squeeze page success, we'll give you back <strong class="underline">TWICE</strong> what you paid for this free template!</p>
<h2>You not only get this <span class="underline">really cool</span> template, but we'll give you the following items <strong class="red">ABSOLUTELY FREE!</strong> </h2>
<h3>That's a <span class="red">$995 value! </span><span class="smalltext">( in some devalued foreign currency)</span></h3>
<div class="checkmarklist">
<p>The original Adobe Fireworks file for easy customization of all template graphics, gradients and buttons</p>
<p>Fully-coded HTML document with all this great content to show you how to style your page</p>
<p>Complete CSS file including all the styles you see here</p>
<p>Absolutely no guarantee of any sort</p>
</div>
<p class="left"> </p>
<h2 class="center">But wait, <span class="red">THERE'S MORE!</span></h2>
<p class="center">Don't just trust what we have to say about our <span class="yellow-highlight">fabulous squeeze page template</span>. Here's what some other great customers had to say about how our landing page helped them crank out over a <strong>300% CTR</strong> and keep their <strong>AdWords CPC at mere pennies per month!</strong></p>
<table width="600" border="0" cellpadding="0" cellspacing="0" class="testimonial">
<tr>
<td width="25%" valign="top" bgcolor="#CCCCCC"><img src="images/sampletest1.jpg" width="123" height="135" /></td>
<td width="75%" valign="top" bgcolor="#EFEFEF"><p>I thought your template was a joke at first, but then I bet my buddy a bucket of bananas that it would convert better than my old squeeze page. <strong>I was right!</strong> I was so busy counting my money that the bananas got overripe and I had to make banana bread.</p>
<p>Thanks for making FreshSqueeze! I'm a much better monkey because of it!</p>
<div class="blockquotesig" style="margin:15px 0 15px 15px;"> <em>Manny the Chimp</em><br />
<a href="#">www.justsomemonkeybusiness.com</a></div></td>
</tr>
</table>
<table width="600" border="0" cellpadding="0" cellspacing="0" class="testimonial">
<tr>
<td width="25%" valign="top" bgcolor="#CCCCCC"><img src="images/sampletest2.jpg" width="123" height="135" /></td>
<td width="75%" valign="top" bgcolor="#EFEFEF"><p>My buddy Manny told me about FreshSqueeze and since my PPC campaigns weren't exactly paying my bills, I thought I'd give it a shot. Instantly I was raking in the dough! Even the orangutans couldn't believe it! </p>
<p>I can even afford to pay someone to pick the "stuff" out of my wife and kid's hair. No more picking for me I say!!</p>
<div class="blockquotesig" style="margin:15px 0 15px 15px;"> <em>Chimp next to the Ape Cage</em><br />
<a href="#">www.chimpbling.com</a></div></td>
</tr>
</table>
<p class="smalltext">(Testimonials are paid celebrities)</p>
<div class="shadowbox">
<div class="sbcontent">
<h1>Hurry! <span class="black">Only </span><span class="lineout">6</span> <span class="lineout">2</span> <span class="black"> 1 left!</span></h1>
<p><strong>This template is being downloaded <span class="red">FASTER THAN EVER!</span></strong></p>
<p>You <strong>HAVE</strong> to download this template in the next <span class="yellow-highlight">30 SECONDS</span> or <strong>you're going to miss out on the opportunity of a lifetime!</strong> And if you come back to this site tomorrow, you'll see the <strong>same thing!</strong> (and next week, and next month...)</p>
</div>
<div class="sbshadow"></div>
</div>
<h2 class="center">If you download NOW, we'll give you this <br />
<span class="red">EXCLUSIVE OFFER!</span></h2>
<p class="left">We'll give you a <strong>FREE DOWNLOAD</strong> of our 1/2 page <strong class="red">Ultimate Guide to Everything</strong> and you'll instantly know everything about:</p>
<div class="checkmarklist">
<p>Area 51 and what the Government is actually hiding!</p>
<p>Who really assasinated JFK!</p>
<p>How your socks mysteriously disappear in the dryer!</p>
<p>The Bermuda Triangle!</p>
<p>Why once you pop, you can't stop!</p>
<p>Why hotdogs come in packs of 10, but buns in packs of 8!</p>
<p>And so much more!!</p>
</div>
<div class="roundbox">
<div class="roundboxtop"></div>
<div class="roundboxcontent">
<p>Enter your name and email address to download our 1/2 page eBook <br />
<span class="red">"Ultimate Guide to Everything"</span></p>
<form id="form2" name="form2" method="post" action="">
<table width="425" border="0" cellspacing="0" cellpadding="2">
<tr>
<td class="label">Your Name:</td>
</tr>
<tr>
<td class="label"><input name="name" type="text" class="input" id="name"/>
</td>
</tr>
<tr>
<td class="label">Your Email:</td>
</tr>
<tr>
<td class="label"><input name="email" type="text" class="input" id="email" />
</td>
</tr>
<tr>
<td><div align="center">
<input name="button" type="submit" class="button" id="button" value="Download Now!" />
</div></td>
</tr>
</table>
</form>
<span class="smalltext"><br />
This is just a sample form. Doesn't really get you an eBook. </span></div>
<div class="roundboxbtm"></div>
</div>
<h1 class="center"> </h1>
<h1 class="center">OK, enough humor already. </h1>
<h2 class="center">Here's the scoop on the <span class="red">FreshSqueeze</span> template.</h2>
<h3 class="center">Template Content Restrictions</h3>
<p class="left">All joking aside, this temlate is free to download and use for your affiliate squeeze or landing page for whatever you wish to use it on. The only restriction is it <strong>CANNOT</strong> be used for any kind of adult content, pirated or illegal software downloads, anything racist, defamatory or otherwise insulting to anyone else.</p>
<h3 class="center">Linking Requirement for Free Use</h3>
<p class="left">The link at the bottom of the page MUST stay in place and not changed in any way. This is the requirement for free use of this template. If you wish to remove the link, <a href="http://www.justdreamweaver.com/contactus.php">contact us</a> for details about licensing the template. We develop these templates to save you time and give your websites a professional appearance. Please give us the courtesy of a link back so others can download free templates too.</p>
<h3 class="center">Altering and Customizing the Template</h3>
<p class="left">This template is a standard HTML document and all presentation is controlled by the CSS file. To customize the font styles, colors, spacing, indents, or anything else, find the appropriate style id or class in the CSS file and change the code to fit the look you want.</p>
<p class="left">The easiest way to customize the page is to save a copy of the page BEFORE you make any changes to the content. Refer back to the original file and simply copy/paste the code for each different box or form. You can easily move forms, quotes, testimonials and headings around the page simply by copying and pasting the code.</p>
<h3 class="center">Using the Fireworks Graphics File</h3>
<p class="left">We include the original Adobe Fireworks file that we used to create the template. This file has all the vector files, slices, gradients and export settings for the images on this page. By using this file, you can VERY easily change any of the graphic elements to fit your color scheme. The file will open in Photoshop, but you may not have the layers and slices as in Fireworks. If you don't have Fireworks, you can <a href="http://www.jdoqocy.com/click-2874929-10503029?url=http%3A%2F%2Fwww.adobe.com%2Fproducts %2Ffireworks%2F" target="_blank" onmouseover="window.status='http://www.adobe.com';return true;" onmouseout="window.status=' ';return true;">download a trial version</a> from Adobe.<img src="http://www.awltovhc.com/image-2874929-10503029" width="1" height="1" border="0"/></p>
</div>
<br style="clear: both;"/>
</div>
<div id="wrap-left"></div>
<div id="wrap-right"></div>
<div id="footer">
<p class="copyright">Copyright © 2008 FreshSqueeze, Inc. All Rights Reserved.</p>
<div class="right"><a href="#">Privacy</a> | <a href="#">Terms of Use </a></div>

<div class="jdlink"><a href="#">Free Squeeze Page Template</a> | <a href="http://www.justdreamweaver.com/dedicated-hosting.html">Dedicated Hosting</a> | <a href="http://www.justdreamweaver.com/free-hosting.html">Free Web Hosting</a></div>

</div>

</div>
</body>
</html>
//
?>

Thanks
1 reply

{{ DiscussionBoard.errors[8019801].message }}

RobinInTexas

11 years ago

Originally Posted by WarGasm

Its a template I'm trying to install within a pre existing theme. I followed the code you suggested but am receiving this error message when I pull up the page: Parse error: syntax error, unexpected '<' in /home/worknman/public_html/wp-content/themes/twentytwelve/freshsqueeze/freshsqueeze.php on line 6

My freshsqueeze.php file looks like this:

<?php
/*
Template Name: freshsqueeze
*/
//
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>FreshSqueeze Affiliate Marketing Template</title>
<link href="css/freshsqueezestyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="header">

</div>

</div>
</body>
</html>

There was a mistake in my guide you need to move the

//
?>
up near

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

as I did in the quote above.
Also you will need to adjust all the references
such as
<link href="css/freshsqueezestyle.css" rel="stylesheet" type="text/css" />
to their correct values, such as
<link href="http://yoursite.com/wp-content//themes/twentytwelve/freshsqueeze/css/freshsqueezestyle.css" rel="stylesheet" type="text/css" />
and create the appropriate subdirectories upload the referenced files appropriately

Thanks

Signature

Robin

...Even if you're on the right track, you'll get run over if you just set there.

{{ DiscussionBoard.errors[8020705].message }}

David V

11 years ago

Based on the knowledge level (no offense, it is what it is), your doing it the hard way for just a landing page.

Creating a template like that for WordPress is a very effective way to do it but it requires you really know what your doing.

I would advise you keep it simple.

Option 1
If your WordPress install is in the root:
(there is already an index.php in the server root)
Upload your landing page assets (FTP) to some folder in the root, let's call it "lp".
Inside the lp folder have all your landing page assets, and you can just call your landing page "index.html" (which is in the lp folder as well).
Now just link to the landing page within WordPress.
examplesite.com/lp/

Option 2
If your WordPress install is NOT in the root:
(there is no index in the server root)
Upload the landing page assets to the root in their appropriate folders (images, js, etc....).
Upload the index.html to the root.
Now just link to the landing page from WordPress.
Also the landing page will become your home page.

[ 1 ] Thanks
1 reply

{{ DiscussionBoard.errors[8019775].message }}

WarGasm

11 years ago

Originally Posted by David V

Based on the knowledge level (no offense, it is what it is), your doing it the hard way for just a landing page.

Creating a template like that for WordPress is a very effective way to do it but it requires you really know what your doing.

I would advise you keep it simple.

Option 1
If your WordPress install is in the root:
(there is already an index.php in the server root)
Upload your landing page assets (FTP) to some folder in the root, let's call it "lp".
Inside the lp folder have all your landing page assets, and you can just call your landing page "index.html" (which is in the lp folder as well).
Now just link to the landing page within WordPress.
examplesite.com/lp/

Option 2
If your WordPress install is NOT in the root:
(there is no index in the server root)
Upload the landing page assets to the root in their appropriate folders (images, js, etc....).
Upload the index.html to the root.
Now just link to the landing page from WordPress.
Also the landing page will become your home page.

OK thanks this actually worked. So using wordpress for this isn't really necessary I suppose.

Thanks

{{ DiscussionBoard.errors[8019817].message }}

David V

11 years ago

You can't declare a doc type, head, footer, /html, /body, etc..... like your doing.
If you insist on creating a template, look at one of the templates inside your theme, you'll see how they pull in the header, footer, etc....
Your landing page has different assets (images, css,....) so you'll need to enqueue those properly as well.

Thanks

{{ DiscussionBoard.errors[8019814].message }}

David V

11 years ago

If you already have a landing page designed in html, there really is no need to make it a WP template unless you plan to create many of them and want to get a little advanced and integrate it into WP.
It makes no difference to keep it separate, just link to it.

[ 1 ] Thanks

{{ DiscussionBoard.errors[8019831].message }}

Istvan Horvath

11 years ago

OP & Robin,
it's time to learn using pastebin or a similar service instead of posting and (even worse!) quoting miles long code here...

Thanks
1 reply

Signature

{{ DiscussionBoard.errors[8021745].message }}

stevebent

11 years ago

I got your guide Istvan, and tried to get a template up on a page. I was able to get the copy there but not the images. I also couldn't see the copy to edit it, but it showed when viewing the page.
I'll give it another shot, I'm determined to edit some of these templates in wordpress

Thanks
1 reply

Signature

Because it's not always what you say, as to how you're saying it

{{ DiscussionBoard.errors[8049059].message }}

Istvan Horvath

11 years ago

Originally Posted by stevebent

I got your guide Istvan, and tried to get a template up on a page. I was able to get the copy there but not the images. I also couldn't see the copy to edit it, but it showed when viewing the page.
I'll give it another shot, I'm determined to edit some of these templates in wordpress

Steve,

If the content - like the sales copy - is part of the template code, then you will not see it for editing in the WP-admin area.

As for the images, you always have to be very careful when editing/typing the path to the images: if not familiar with WP-specific template tags, I'd suggest usingt absolute path, like

Code:

http://example.com/imagefolder-name/imagefile-name.jpg

Thanks

Signature

{{ DiscussionBoard.errors[8049248].message }}

How to add landing page templates to wordpress?

Trending Topics

Any thoughts on golf's latest phenom...Scottie Scheffler??

Should i Index Author pages?

best high quality crypto traffic.

What's the Best IM-Related Skill to Learn Today That Can Help in the Future?

Some interesting stats about brand comms