Joomla how to click graphic image and go to url

I am using the latest version of joomla hosted on my own server.

I have an image of a sine wave and when its clicked I want to have an mp3 play, it can either be via soundcloud or on the server itself but not sure how to do this part.

the last graphic in the code is called sineweb.


<p>[carousel]</p>
<p>[carousel_item]</p>
<p style="text-align: center;">AL1</p>
<p><img style="display: block; margin-left: auto; margin-right: auto;" src="images/P9275893.png" alt="" />
</p>
<p>[/carousel_item]</p>
<p>[carousel_item]</p>
<p style="text-align: center;">Colour Oak</p>
<p><img style="display: block; margin-left: auto; margin-right: auto;" src="images/P9075704.png" alt="P9075704" width="266" height="199" />[/carousel_item]</p>
<p>[carousel_item]</p>
<p style="text-align: center;">Colour Cherry</p>
<p style="text-align: center;"><img src="images/P9075706.png" alt="P9075706" width="270" height="202" />
</p>
<p style="text-align: left;">[/carousel_item]&nbsp;</p>
<p>[carousel_item]</p>
<p style="text-align: center;">Multiple Outputs</p>
<p style="text-align: center;"><img src="images/PA086979.png" alt="PA086979" />
</p>
<p style="text-align: left;">[/carousel_item]</p>
<p style="text-align: left;">[carousel_item]</p>
<p style="text-align: center;"><span style="text-align: center;">Listen</span>
</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="images/sineWeb.png" alt="sineWeb" width="181" height="136" />
</p>
<p style="text-align: left;">[/carousel_item]</p>
<p>[/carousel]</p>

Open in new window

ee.JPG
PeterBaileyUkAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Rowby GorenCommented:
Hi

Try doing this:  
<p style="text-align: center;"><a href="/music.mp3"><img src="images/sineWeb.png" alt="sineWeb" width="181" height="136" /></a>

Open in new window


Just link the image to the url of the mp3.   In that case it should bring up the mp3 player on the visitor's local computer.

There are other joomla plugins which would have the music play within the browser itself, but you can try this first, and see if it gives you what you want.

If you want to use a joomla plugin to to this, check out this player (I haven't tried it but lots of good reviews:  Mp3 player for articles
0
PeterBaileyUkAuthor Commented:
where do i store the mp3? in any particular directory
0
Rowby GorenCommented:
If you are going to use just the "image link" method, then you can probably just create a directory off the webroot called mp3,  or whatever you want to name it -- and put your mp3's in that folder.  Probably want to include an index.html file in that folder to prevent people from peeking in that folder -- and for security reasons.

Rowby
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

PeterBaileyUkAuthor Commented:
can the index.html be blank? ive not heard of that before.
0
PeterBaileyUkAuthor Commented:
I have the web directory with a new mp3 folder and an mp3 file inside but i get page not found:

<p style="text-align: center;"><a href="/web/mp3/firtstest.mp3"><img src="images/sineWeb.png" alt="sineWeb" width="181" height="136" /></a>

i tried also without /mp3/firtstest.mp3
0
PeterBaileyUkAuthor Commented:
I have another question but will post a new question
0
Rowby GorenCommented:
Is the mp3 playing ok now?
0
PeterBaileyUkAuthor Commented:
yes
0
Rowby GorenCommented:
Great!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Joomla

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.