Understanding of landing pages:

A landing page by it’s self is a single page of your website that is aimed to certain target of users or advertising campaign. There are few main purposes to make a landing page:

– Promote certain good or service that you are offering.

– Make your visitors taking certain action – Subscribe to your newsletter, register to your website, invite people, share in social medias, download a material, bookmark etc.

– Get to known your users with certain information – new terms of use, special delivery terms, changing your office, holiday work time and etc.

In this article I will try to give you few great tips on what’s important to do to take the most of landing pages.

1. Think, focus and plan your landing pages

What’s the goal of your landing page? Every landing page needs its goal, its target audience and its focus, it’s only reason to be stand-alone landing page, and not a part of your ‘about’ or ‘promotions’ page  for example. Think about what are your expectations of this page. What do you want to achieve with it – more subscribers, more sales, more registrations, more shares or etc.

2. Design it better

2.1. Clear Call to Actions

Your call to actions must be tied to your landing page goals. Think about what emotions and actions you want to provoke in your visitors and try to call it with every possible element of website – hero image, CTA buttons, colors, text etc.

Try to create custom call to action texts for your buttons. Good example of this is WhenIWork.com which is online scheduling software. They use “Start scheduling” as their CTA. What could you think about your CTA instead of “Buy now”, “Start now”, “Subscribe”?

2.2. Social proof & Trust elements

Including social proof elements like testimonials and case studies is pretty valuable for your landing page. Trust elements like credit card logos, company address, https and secure payments signs and money back guarantee is also very significant to build trust in your visitors.

2.3. Right flow

Use the right flow and the right order of your landing page elements. Here’s a good formula for that:

1. Try to remove all sitewide navigation elements.

2. A nice hero image, floated by clear headline and CTA is always underlined with your customers logos is a good start.

3. These you can follow by your product key features and advantages displayed in very readable way (images, and short text).

4. Add few good testimonials or case studies followed by a CTA section with great headline and pricing (if you sell).

If you have to design long sales page its good practice to include trust elements and CTA sections after almost each of the sections. “Ready to start?”, “Ready to order?”

3. Use the right wording. Be short.

Use Simple headlines.

As most of you know people hate reading. Your visitors just land on your page and read by diagonal. So try to catch their attention with easy to read and understand headlines and don’t believe they will really read all the text in your site.

So here are few simple rules to follow when you are writing headlines for your landing page:

• Be specific and short.
• Tell what they get. Not what you sell.
• Focus on one thing that is most valuable for your customers
• Try to reflect the expectations of the visitor

4. Show it to the right audience

Finding the right audience for the landing page is as much important as everything I’ve written above in this article. Before starting your advertising campaigns think about the following:

• Who is your product/service for?
• Who is this landing page designed for?
• What kind of device are they going to use to see it?
• What time of the day are they going to visit it?

So the significant difference between primary tab open rate (35%-50%) and promotions tab (5%-10%) make many marketers want to get out of the last tab. But how can we prevent our newsletter mails to go to Promotions tab?

Here is the traditional way that is almost inapplicable, making your readers to move your emails to the Primary tab:

Here are few simple tips you can try:

1. Always write in the right time.

Do not send newsletters over the weekend or holidays (this is a sign that you are promoting something). Try to contact your subscribers whenever they are up to this. The best time for this is 2-3pm. The end of the workday is great time to contact them. They are still focused in their email and it’s absolutely business emailing time. If you email once per week statistics shows that the best days for this are Wednesday and Thursday.

2. Use no images. And include maximum 1 link. No Rss.

Many marketers will disagree using of no images in your email, but that is very valuable for reaching the primary tab. You can catch your readers attention with right text formatting and replace the call to action fancy image buttons with the right wording. Including maximum 1 link will guarantee that you are not sending promotional email with links to many offers in your website.

3. Write your emails in traditional letter form.

Try to write your readers like they are your friends. Using traditional language in your emails will help you to get out of the promotions tab. “Hey George, how are you doing?”, “It’s Dido from Front End Factory. I hope you are doing well.” and etc.

4. Make your emails personal. Reader’s name is a must have.

If you are using aweber or mailchimp you can include your readers’ details in your emails to make them more personalised. Include as many personalised elements as you can. Adding user’s company, project name or address is also a great solution if is possible for you.

5. Do not use promotional words.

Your email and especially subject should be free of promotional wording like “Promotion”, “Sale”, “Discount” etc. Here are few bad examples for your subjects “Hey Mike, see our promotions today”, “Limited time offer for you”, “Save up to 50% on our new collection”, “Get rich with us” and etc.

I hope this article will help you to reach the primary tab of your readers’ gmail accounts.

Please share tis article to help your friends doing this also.

1. Layout it right

Give your customers the feeling that they are in a checkout page and just need to do 1 step to complete their order. Let them focus on filling their shipping & billing details.

Use one-page checkout. Many case studies have shown that one-page checkouts convert better than multi-step checkout pages. Anyway if you really have to make your checkout page in few steps, let your customers know where they are, what have they passed and what is left. In every next step show them what they did in the previous, that way you will prevent them of going back to the previous steps/pages.

Removing main site elements like navigations, sidebars, big footers, banners etc are also one of the best things you can do in point of design. It’s important to have you customers focused and feeling comfortable to finish the checkout.

PayPay’s checkout is a great example of simple one-page checkout.

2. Simplify

Guest checkout option is important. If your customers are not logged in always give them first the ability to checkout without a registration or give them option to sign up with one-click using their facebook accounts. Customers don’t like registering, its engaging. You always can send them an account password after they finish their order.

Ask them only for what you need. People do not like filling unnecessary fields. The less fields your customers have to fill, the faster they will finish the checkout process. Always use default billing address same as shipping with checkbox option to show the billing fields.

3. Trust elements

You have to give your customers the feeling of security checkout process. HTTPS is mus-have. Put logos of the credit cards and payment methods that you accept. Giving money-back guarantee is also really helpful. Adding the right testimonials to the checkout page is worthy.

4. Give enough information

Show clearly all the products of the purchase with their prices, including delivery information, taxes and etc. Your customers want to be sure what they order and how much they will pay. Otherwise you risk them to leave the checkout page looking for total prices in basket page or shipping costs on the delivery page.

5. Prevent exits

You should keep your customers in the checkout page until the time they pay. Try to prevent any option of leaving the page during that time. You can use a simple javascript code or popup if the customer try to leave the page by mistake or even offer them discount if they do it.

I the tips from the Front End Factory will help you to increase your conversion rate.

You can subscribe to our newsletter to get weekly tips on how to better your CRO.

1. Teamwork Projects – Your business timeline

Probably the best project management software out there. It involves so many great features like sub tasking, time tracking, invoicing with different hourly rates or taxes, milestones, late tasks, reminders, team chat, and etc. 100% brandable with many 3rd party integrations. You will just love it and get addicted to it.

Price: starts at $12/month
Free version: Yes
Mobile app: Yes
Visit Teamwork Website

2. Slack – chat for teams

The most efficient and funny way to chat with your team. Allows running multiple teams, chatting in many topics in groups or private, voice chat and screen sharing. Slack-hosted file sharing with great file & history search that will never let you loose an attachment.

Price: Free
Mobile app: Yes
Visit Slack.com

3. Invision app – design management made easy

InvisionApp is the best way to communicate with your clients and manage the design process. Gives great options for design prototyping and collecting/discussing on clients feedback. Even has option for you and your client to draw at the same time in the same screen. Thats amazing! Also you get notified about every single action, comment or file version change so that you will always be on track with what’s happening. Strongly recommend it for web designers and web design companies working remotely with their clients.
Price: $19/month
Free trial: Yes
Mobile app: No

4. ScreenHero – Sharing your screen or even the whole device

This amazing app allows you to share your screen while having a call with a client or colleague and even give them the ability to use your browser, keyboard and clipboard. Super fast and light solution that moves screen shares to next level.
Free trial: Yes
Mobile app: no
Visit Screen Hero website

5. Time Doctor – Stop wasting time

The software that raised our employees productivity with more than 30%. If you manage remotely teams work with freelancers or just want to take more of the time that you are paying to your employees TimeDoctor will help you do that. Offers great features like start/end work, tracking mouse moves, screenshot & weak time use, TimeDoctor can boost your team’s effectivity to the sky and lower your expenses paying for wasted time.
Price: $9/user
Free Version: Yes
Mobile app: Yes
Visit TimeDoctor

The aim was to show a custom html/css page on a certain url /share/ and I found a really quick solution, that worked for me and I hope will work for you.

Two simple steps for this:

1. Create a page in wp-admin, called Share (slug share):

2. Add this piece of code In your plugin directory, and its mail php file (in my case index.php):

function elegance_referal_init()
{
	if(is_page('share')){	
		$dir = plugin_dir_path( __FILE__ );
		include($dir."frontend-form.php");
		die();
	}
}

add_action( 'wp', 'elegance_referal_init' );

As you see it simply does 2 things:

1. Create a function that includes php file in the template directory, when we’re on the page called /share/

2. Run the action when wordpress is inited before any other script.

3.  Put this code in your frontend-form.php (the page that will appear in your wordpress site front-end under the url /share/)

<!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>My WordPress Plugin Front-end Page</title>
<?php
//call the wp head so  you can get most of your wordpress
wp_head();
?>
</head>
<body>
<h1>Here's my plugin front-end page</h1>
<h2>You can put anything you want in this php file.</h2>
<?php
//call the wp foooter
wp_footer();
?>
</body>
</html>

I hope this snippet will help you.

Please share any other solutions that worked for you for this problem.

1. Write with Sublime Text

SublimeText is an ultra fast text editor that made our work so much easier and lighter. Supports a lot of features that will make you feel comfortable with your code.

Link: http://www.sublimetext.com/

2. Use Less/Sass with Prepros

Benefits of using less css or sass as css framework are so much. Once you get used to this you will never go back to writing old-school css. They come with powerful short-hand codes and functions that will decrease your source code’s line numbers with up to 30%. Reusing or developing the code that you build with less or sass is much more easier than the plain CSS code. Small example of sass:

.header {
.menu {
   li {
    a {
     display:block;
     .rounded(5px);
     background:#eee;
     &:hover {
        background:#ccc;
     }
    }
   }      
 }
}

Prepros complie all your less files into the css code you need immediately after you save.

Links:

http://lesscss.org/
http://sass-lang.com/
https://prepros.io/

3. CSS HAT for photoshop

This plugin will help you turning photoshop layers into css lines of code. It takes text proerties or layers blending options and turns them into a css/less or sass code that you can simply copy and past into your text editor. Saves you tones of measures and time ot check if you have written the right gradient or box-shadow properties.

Link: https://csshat.com/

4. Cut and slice me for Photoshop

Cut and slice me provides you very easy and fun way to export all your photoshop assets into web format graphics (png/jpg), with option to export few formats for them, also retina ready for vector shapes. Really cool photoshop plugin

Link: http://www.cutandslice.me/

5. Browser Stack

Oh man, where can i find IE 7 now to do tests.. or windows XP? Awful question, but s**t happens. The best way to have all kind of devices, OS, platforms and browsers in less than $30/month is using BrowserStack. Absolutely pays every cent of the amount when it’s a question of cross browser, device or platform testing. With the subscription you get remote access to all kind of virtual devices, OS and browser.

Link: http://browserstack.com/

That’s how we manage doing more within less time.
I would love if you share your way to work faster and easier.

Put this code in your header.php before </head>

<? wp_head(); ?>

And this must be in your footer.php file right before the closing body tag </body>

<? wp_footer(); ?>

Please not that these two lines of code will also allow the proper work of all the installed plugins, because they will print all their javascript and css files into your soruce code.

If this does not work for you please check if there is an fixed html element (like toolbar) that is laying over the wp toolbar. If so – you will have to change its z-index css property to lower that wp-toolbar’s one.

Enjoy!

Of course the best solution is creating a new theme from scratch. In this tutorial I will show you a bunch of tips and plugins that will help you to create your custom wordpress cms based website easily.

1. Wp Types

Creating custom post types and custom fields is required in most of our scopes when its a question of custom development. Its good that this has never been easier.With wp types you can easily create custom post types, attach them big variety of custom fields (checkboxes, textaras, dropdowns, files etc. etc.). Its nice that you can define custom fields based on post type, page template, category end etc.

website: http://wp-types.com/

2. Optimizepress plugin

Great way to give your clients the freedom of creating pages with rich content. Optimizepress may look “lame” style, but its really powerful tool when its a point of not-standard and template-based pages development. They have large variety of web elements that you can put in your wordpress editor with simple wizard (no shordcode writing needed). Their library includes many call to action (CTA) buttons, subscribe forms, social sharing and following buttons, video players, accordions, tab elements and etc.

3. Contact form 7

99.9% of the websites has contact form. We strongly recommend using contact form 7 plugin for creating advanced contact forms that could be sent to email or saved in database. Contact form 7 also have great callback options and additional plugins which makes it #1 solution for me.

Download from: https://wordpress.org/plugins/contact-form-7/

4. Woocommerce

Known as the best ecommerce solution for wordpress sofar, woocommerce provides a powerful core of ecommerce functions that can help you to creating your theme into custom wp based online shop. WooCommerce comes with very easy to customise templates structure and a lot of external posibilities for payments, delivery, product showing and etc.

It was not my first time seeing this error, but at this moment I wanted to spend more time on it and find a solution. Really I’ve looked all over blog posts, stackoverflow, wordpress comunitly and nothing didnt worked.

So finally I went stright to the database and find the problem and the solution.

So here’s the solution:

Because of the database transfer I had to change the table_prefix variable from wp-config.php.

by default i had:

$table_prefix = 'wp_';

and I hade to change it to

$table_prefix = 'wpnew_';

And that’s where the problem comes from, wordpress uses this perfix to insert few values in `wp_usermeta` which are using this perfix.

So here is how my wp_usermeta looked like and I didn’t manage to login to wp-admin, beacuse was using the old table_perfix (wp_):

And changing wp_ in the meta_key’s column did the magic.

And wow. This worked!

So the most easy way to change tables names for wordpress site is :

1. Export your database dump

2. Find “wp_” and replace with “wp_new”

3. Upload and set the new perfix in wp-config.php

I hope this article will work for you guys.

Here is a short list of Wordpress plugins that can better your conversion rate.

1. Elegance Modal Box

Is really simple, but effective plugin that popups modal boxes when your visitors enter your website. Modal boxing a really good tool to lead your visitors exactly where you want to lead them. Great for showing promotions, pools, collect subscribers or facebook fans. Do not forget to turn on the cookies option, its annoying to have this pop up once when you have closed it or have subscribed into.

Visit site

2. Hello Bar

Hello Bar is another great product by Crazy Egg. It simply is a web service that generates beautiful sticky top bars, which can collect emails, likes, or just show a message.

Visit site

3. WordPress Landing Pages

A great plugin that helps you easily to create, track and manage landing pages, including spit A/B Testing of different pages. Easy to monitor and see what exactly works better for you.

Visit site

4. WP Conversion Boxes

WP Conversion Boxes is a wordpress plugin that helps you to easily create high converting email opt-in and CTA boxes with conversion optimised design that you can use wherever you like on your blog.

Visit site

5. Quick Chat

Quick feedback and communication with clients is really important when it’s up to ecommerce.  Quick chat allows you easily to put self-hosted chat plugin into your wordpress site, that will let your visitors to ask you important questions on important stages of their conversion funnel.

Visit site

6. WordPress Call To Actions

Helps you to create easily great call to action buttons, pop ups, and sections which you can place wherever you want on your blog – posts, sidebers and

Visit site