clickable background image

[evelina van ‘t Hoog]

Hi Bill!

I am making a small action page with Foxy.

What I would like to do is the following, someone comes on the website and there is a full screen background image with 2 clickable buttons to choose from, in 2 languages that lead to other pages underneath.

I have tried to make a background image in Photoshop with these 2 buttons in 2 languages ‘click here’ but unfortunately that does not work.

Do you think this is possible at all?

Thank you for your support!

evelien

[Bill Robbins]

Evelien,

That’s a very interesting idea you have there. It can be done too. What you’ll want to do is create a page to be your home page. You can assign it to be the front page of your site by going to the Settings section in your WordPress control panel and selecting Reading.

Once it’s the front page, we can add two buttons directly to the content on that page. The theme actually has what’s called a “shortcode” that you can use to insert buttons. It works like this:

[button url="http://yourlink.com" label="Button Text"]

where http://yourlink.com is the URL you’d like the button to link to and Button Text is what you want the button to say. Just enter that into the content of the page; one for each button.

Then go to the Theme Options page and choose the styling tab. Scroll down to the Custom CSS box and add this:

.home header#primary,
.home #logo,
.home #sidebar,
.home .title {
	display: none;
}

.home #content {
	background: none;
}

.home .wrap {
	padding: 0;
	height: 100%;
	width: 70%;
	display: table;
	vertical-align: middle;
}

.home #content {
	padding: 20px;
	width: 100%;
	height: 100%;
	float: none;
	display: table-cell;
	vertical-align: middle;
}

and save your changes. That should hide everything on your front page except for the buttons that you’ve added.

See if that won’t do the trick and let me know if you have any trouble or questions,
Bill

[Author]

Posts