Adding a download button on your WordPress site is one of the best ways to grab the attention of your readers and diversify your site’s content. You can also use it to increase conversion rates. But the challenge now lies in how to add buttons to pages and posts. WordPress does not provide any built-in features that allow you to create buttons. So, in this article, I will show you how to add a download button on your WordPress site.
Contents
File download buttons bring great value to your WordPress site. Since this button creates a call to action, it is an effective way to increase conversions as well as make your content easier to read.
Increase conversion rate
Adding a WordPress site download button allows you to pique the curiosity of your users. Instead of forcing them to buy the entire course, you can give users a free guide or e-book. This gives you a higher chance of getting sales.
Split page or post content
Similar to the visual illustration, the file download buttons help you to split the content. You don’t want your audience to get tired of reading a long block of text that makes them lose interest in reading. The download button will make it easier to read and at the same time redirect the user’s attention to the desired interaction.
If you are a non-programmer user, it is not easy to create a download button, using HTML/CSS is really not friendly for beginners. With the following 4 steps, I will show you how to add a download link to your WordPress site.
First, add the link to your WordPress content as usual by bolding the desired text, clicking the “Add/Edit Path” icon on the menu, and pasting the URL there.
Move to the “Text” tab at the top of the edit screen, now add a CSS class near the download link. You can name this class “download-button”. This class allows you to adjust the style of the link just like a real button.
Go to the preview page and select the Customize option to start styling your link.
There is an “Additional CSS” option on the left navigation menu for you to choose from. Then paste this CSS code in:
.download-button {
background-color: #4285f4;
border: none;
color: #ffffff;
padding: 10px 10px;
font-size: 24px;
}
<div>
<span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span>
</div>
You should replace the background color, border state, and font size with the colors you want. You can also try changing the padding to customize the look of the download button again.
Epilogue
hopes this will help your site to be more diverse in content.
If you find it interesting, you can follow the WordPress basics section to know more new knowledge.
Follow fanpage to receive the latest posts: Group
