Code for adding link on button

[camscorner]

I know this is an incredibly stupid question but I am no techie. I can follow instructions fine but this one seems to be missing from the instructions.

I have Smart Passive Income Pro. I am in the Front Page 2 Widget area where you add the text for the "Get started" button. The instructions shows the following.

We help creative entrepreneurs build their digital business by focusing on 3 key elements of a successful platform — design, content + strategy.

Get Started

My questions is - how do I alter the code so when someone clicks on the "Get Started" button, it leads to the page I want? In the demo, it just goes back to the Home page/

https://my.studiopress.com/documentation/smart-passive-income-pro-theme/front-page-setup/front-page-2-widget-area/

[Victor Font]

You use an HTML link: https://www.w3schools.com/html/html_links.asp

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[camscorner]

Sorry, but this does not help me. The code in the instructions is Get Started That gives me the button and the text on the button I need but I don't know where to add the url to the page I want without screwing up button form.

[camscorner]

Dang it - the code keeps converting it to the Get Started. I don't see where I can add an attachment to this so you would have to look at the instructions to see the code they used.

[Brad Dalton]

Paste the HTML into a Github Gist and link to it from here.

---

Get Help – Book Consultation.

[camscorner]

Thanks, Brad! See link below.
https://gist.github.com/anonymous/fdfd51052f016f5a9b715772f7dd339f

So, to reiterate my problem. The above code creates the button and adds the "Get Started" text on the button. What I need is how to adjust the code so when someone clicks on the button it links them to the page I specify. Right now the instructions for Smart Passive Income just keeps you on the Home page when you click on the button.

Sorry I am such a novice. I do appreciate the help.

[Brad Dalton]

Replace the # with the link to your page like this

href="http://example.com"

---

Get Help – Book Consultation.

[camscorner]

Thank you!!! 🙂 Even I can handle that.

[camscorner]

New issues - all these years later. 😉 I redesigned my site. I used a staging site and the button work just fine. I had this in Front Page 2 widget of Smart Passive Income child theme in a text with the html.

Text part
Discover the help you need to keep your business communication simple, clear & uniquely yours
HTML part
Click here for a quick site tour

When I try to duplicate it in the live site, it writes the above HTML on the home page under the text. If I add the Custom HTML and put the code there, it shifts the text to the left, decreases the size of the font and puts the button to the right.

If there's a way to submit images, I can send you an image of what I am talking about.

[camscorner]

Oops code was <a href="https://simplystatedbusiness.com/" class="button">Click here for a quick site tour</a>

[Anita]

You redesigned your site using what theme? The CSS for Smart Passive Income would probably be different than your new theme.

---

Love coffee, chocolate and my Bella!

[camscorner]

it"s the Genesis theme (Version: 3.2.1) with its child theme, Smart Passive Income (Version: 1.1.3). I'm a bit confused by the question.

[Anita]

I am asking the theme name because your original post was from 2017 and in your lastest question you said,

I redesigned my site. I used a staging site and the button work just fine. I had this in Front Page 2 widget of Smart Passive Income child theme in a text with the html.

From that I gathered you switched themes and the button no longer works as expected with a new theme.

Please provide a link to the site and location where the button appears and I can take a look.

---

Love coffee, chocolate and my Bella!

[camscorner]

Sorry for the confusion. The site is https://simplystatedbusiness.com.The button and text are small and shifted to the left.

Click on this link to view an image of how I want it to look (taken from my staging site).

[camscorner]

https://gist.github.com/anonymous/fdfd51052f016f5a9b715772f7dd339f

[Anita]

Can you put your button in place so I can see how it looks? I can then use the dev tools to provide the code.

---

Love coffee, chocolate and my Bella!

[camscorner]

Okay, if you go to https://simplystatedbusiness.com, you will see the text and button that is not aligned like I want (and how it showed in the development site) `https://gist.github.com/anonymous/fdfd51052f016f5a9b715772f7dd339f'

I set this up by using a text widget for the "Discover the help..." text and used Custom HTML for the button. Thank you! I appreciate your help.

[Anita]

You want to try something like this:

.front-page-2 #custom_html-7,
.front-page-2 #text-30 {
    float: right;
    clear: both;
}

Then remove the extra space from the top widget to close up that space.

---

Love coffee, chocolate and my Bella!

[camscorner]

Thank you. Pardon my non-techie ignorance, but do I put this in the Custom HTML widget or under the text in the Text widget?

[Anita]

Oh, sorry! I thought you knew. Add that to Appearance > Customize > Additional CSS.

Keep in mind that the code works for the two widgets there. If you remove them and add them back, their class may change, i.e., #text-30 may change to #text-45.

---

Love coffee, chocolate and my Bella!

[Author]

Posts