I Need Help On Coding Issue - Webmasters

I Need Help On Coding Issue - Webmasters - Nairaland

Nairaland Forum › Science/Technology › Webmasters › I Need Help On Coding Issue (748 Views)

I Need Help On Coding Issue by ProudlyTunes(op): 10:32pm On Oct 21, 2018

bloggers & webmasters, please I need this code, I attach the picture below, That is the DOWNLOAD Mp3 will be in Red block exactly it is in the picture. am not good in coding that's why
please help

Re: I Need Help On Coding Issue by Ayo081(m): 11:04pm On Oct 21, 2018

ProudlyTunes:
bloggers & webmasters, please I need this code, I attach the picture below,
That is the DOWNLOAD Mp3 will be in Red block exactly it is in the picture.
am not good in coding that's why

please help

Html

<p class ="dwnld"> DOWNLOAD MP3 <\p>

Css

.dwnld {

background-color = red;
color = #fff;
/* you can as well add radius to your border */

border-radius = 10px;

}

Re: I Need Help On Coding Issue by Nobody: 11:10pm On Oct 21, 2018

Ayo081:
Html

<p class ="dwnld"> DOWNLOAD MP3 <\p>

Css

.dwnld {

background: red;
border-radius: 10px;

}

Re: I Need Help On Coding Issue by Julius2214(m): 12:53am On Oct 22, 2018*

You can either use an image button like the image below, or use pure css. It seems you're a beginner, so I'll just break it down to the lowest level of understanding.

If your using an image button, you'll need to have the image uploaded first.

You need 2 links for this style

1. The link to where u uploaded the music or the video file(eg. http://site.com/music-file.mp3)

2. The link to the image that says "Download MP3"(eg. http://site.com/image/download.jpg)

Then u create an href and img tag containing both links above.

See below:

<a href="music-link-here(link1)"><img src="image-link-here(link2)"></a>

So after adding the links, it'll be like this below:

<a href="http://site.com/music-file.mp3"><img src="http://site.com/image/download.jpg"></a>

So just paste the link where u want the download button to appear... That's all

Re: I Need Help On Coding Issue by Julius2214(m): 1:16am On Oct 22, 2018

You can also do this without using image but just css.
Copy this code below and paste it where u want your download button?

Change the link to your music download link.

<p class ="dl-button"><a href="http://site.com/music-file.mp3"> DOWNLOAD MP3</a><\p>

CSS

.dl-button {
background-color: #f44336; /* Red */
border: none;
color: white;
padding: 12px 40px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
}

1 Like

Re: I Need Help On Coding Issue by ProudlyTunes(op): 6:55am On Oct 22, 2018

Thank you all for your concern, but am still hating problems with the code

Re: I Need Help On Coding Issue by ProudlyTunes(op): 7:05am On Oct 22, 2018

Julius2214:
You can also do this without using image but just css.
Copy this code below and paste it where u want your download button?

Change the link to your music download link.

Where will I paste the code,
is it when I what to write new post?

or the code is to be pasted in my theme
am confuse

Re: I Need Help On Coding Issue by Nobody: 11:32am On Oct 22, 2018

ProudlyTunes:
Where will I paste the code,
is it when I what to write new post?

or the code is to be pasted in my theme
am confuse

Where did u copy the code?

Re: I Need Help On Coding Issue by ProudlyTunes(op): 3:49pm On Oct 22, 2018

modestbrowser:
Where did u copy the code?

i don't have any idea that's why I need help

Re: I Need Help On Coding Issue by Nobody: 3:51pm On Oct 22, 2018

ProudlyTunes:
i don't have any idea
that's why I need help

Inside the HTML

Re: I Need Help On Coding Issue by ProudlyTunes(op): 5:48pm On Oct 22, 2018

the headers or Footer's abi where?

Re: I Need Help On Coding Issue by Julius2214(m): 5:53pm On Oct 22, 2018

Are you using Blogger or WordPress?

Re: I Need Help On Coding Issue by ProudlyTunes(op): 5:57pm On Oct 22, 2018

Julius2214:
Are you using Blogger or WordPress?

WordPress

Re: I Need Help On Coding Issue by Julius2214(m): 11:19pm On Oct 22, 2018*

OK, if you're using WordPress, you'll need to add this css code to your WordPress. To do that, open Appearance >> Customizer >> CSS.
Paste the code below in the provided text box.

You're doing this so that you won't have to manually add new css each time you want to create a download button

Here's the css code


.dl-button {
    background-color: #f44336; /* Red */
    border: none;
    color: white;
    padding: 12px 40px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}

Then go to the post where you want the download button to appear and past this html code there.

<p class ="dl-button"><a href="http://site.com/music-file.mp3"> DOWNLOAD MP3</a><\p>

Make sure u paste it exactly where u want to add the download button

Re: I Need Help On Coding Issue by Julius2214(m): 6:28pm On Oct 23, 2018

Don't forget to drop a comment if it worked

1 Reply

I Need Help On Webadmin • I Need Help On Facebook Ad • I Need Help On Zox News Wordpress Theme • 2 • 3 • 4

I'm Buying Established Quora Accounts (if You Have For Sale, Come In) • Facebook Account For Sale • Sell Your Gift Cards To Cardvendor Good And Reliable