Quantcast
Channel: Text Widget – Build Your Own Business Website
Viewing all articles
Browse latest Browse all 15

Lesson 10 – Part 6 – Create a Call to Action using a Text Widget

$
0
0

The next thing we’re going to do is create a call to action in text widget for our business/professional Genesis theme webiste. The call to action that we’re going to create is this one here so it’ll have a heading, a contact link, another link and it’ll have some text. I’m just going to start that whole process by copying this.

Create a Plain Text Widget

What I really ought to do first is create just a plain old ordinary text widget. This is a testimonial text widget, copy that text and I’m going to put it here in this text. This is going to be the heading so if we come back over to our Widgets and go to our Primary Sidebar and drag the text up here.

For the title it’s going to be “by far the most accurate detail instruction I’ve come across”. The text will be that part, just paste it in there, hit Save, come back over and refresh the page and there’s our testimonial widget. We’ve got the heading, we’ve got the text and everything is left justified.

Install Black Studio TinyMCE

In this contact widget, we’re going to center some of the text. In order for us to do that, we’re going to actually install another plugin for our Genesis theme website which is the Black Studio TinyMCE widget. We’re going to start off by going to plugins, Add New and we’re going to search for Black Studio.

This is the Black Studio TinyMCE widget so we’ll install that. What this does is this brings the power of the visual editor to the text widget. We’ve activated it, we come back over to Appearance and Widgets and now we have this new widget over here, Black Studio TinyMCE. It’s essentially a text widget that has the visual editor associated with it.

There wasn’t any way for you to choose anything special here in the regular text widget, right? You couldn’t insert an image, you couldn’t make something bold or change anything like that. However with this, you can. Come back over to this and delete that information, come back to here, let’s just copy all this, put in our text, “We love helping Small Business Owners Build Their Own Sites”.

Style the Text in the Widget

Notice how this is centered? Since I want it centered, I can’t put it in the title so I won’t put it in the title, I’m just going to put it here, “We love helping Small Business Owners Build Their Own Sites”.

The next thing is the phone number so I’m going to come down a line and put the phone number in. The next thing is “Click to Learn More About this Course”, come down another line and put that in and we have our text so we’ll come down one final line and put that in.

What we’re going to do is take this one and we’re going to make it an H3, that’s what the title would’ve been. Had it been the title, it would’ve come in as an H3 so it’s going to end up with exactly the same style except here, we want to center align it. This we are going to center align, this one we’re going to center align as well but we want it to be a link so we’re going to link this off to another page.

Insert the link and I’m just going to insert BYOBWebsite for the moment. It could really be anything you want it to be, any kind of a link at all but what we’ve done is we centered it and I’m going to make this an H4 and hit Save.

Notice that this has an HTML view so I could look at the HTML view instead or the visual view. I could insert an image, a NextGEN Gallery and I can do all these same kinds of things that I could do in the visual editor here.

If we refresh this now, you see “We love helping Small Business Owners Build Their Own Sites”, here it is, “Click to Learn More About this Course”, if we click on that, it takes us off to BYOBWebsite. This is a call to action widget.

Create an AWeber Call to Action

We’re going to put an AWeber call to action in here as well. If you know what AWeber is then you’re going to think this is pretty cool. If you don’t know what AWeber is then this will be mystifying . AWeber is an email marketing system but it’s definitely useful for a call to action. I want to go to this list and look at my web forms and I’m just going to go to the free register list.

This is what my web form looks like right now. If you’ve used AWeber, you know what this is like, we just go over to step 2, go to step 3 and we can say, ‘I Will Install My Form”. The easiest way to do it is just to grab the JavaScript which is this, copy that, come back over to a text widget, drag your text widget up into there, paste it, hit Save. Hit refresh and here is the form inserted into this.

It could very well be that you’d rather not have this gray background and this line because it conflicts with this. In this case, go back over to web forms and copy this web form but in terms of the body, we’re going to make our background, “No Color”. In terms of the border, I don’t want any border at all so there you go, “No Color”.

I’m going to save this web form and go to step 2. This will stay all the same, I’m going to install my old form, here’s a different version of it without that background information, come back over to our widget and change the script.

It’ll be “Sign Up for Our Newsletter” for example, save, come back over and refresh this. Now, you have a nice custom looking sign up form for your Genesis theme website that would automatically integrate in there with AWeber. This is another way in which to add a call to action to your page.


Viewing all articles
Browse latest Browse all 15

Trending Articles