Add Price and Other Info To Products Page

I need that the price of the products shows on the preview of the thumbnails on the products part of the site. I was looking on the options and i didn't see how to make the price and the author to show.
Here:
http://musicmakerscity.com/store/products/

I also need To add A Preview Play Button for the mp3 track uploaded by the users. Same link above

Also That Shows the price, add to cart, name of the author and a bpm(bits per minute) options so the users can see the speed of the track that the user that uploaded the track set.

All this i want it to show on the products page also on the featured and latest tracks section that it will show on the homepage.
Here:
http://musicmakerscity.com/

On the website i am managing the profiles of the users with the built in system that the Theme I'm using has. The Theme is called Musica bought on Themeforest.

Also how can i make what it shows here http://musicmakerscity.com/ on the homepage as well

I have a lot of questions and i'm so stuck with this project. I really appreciate your help on this.

Thank You So Much For Your Time.

  • Jack Kitterhing
    • Code Norris

    Hi there @pedro_jimenes

    I hope you are well today.

    With regards to the price and author of the product to show on hover of the thumbnail? And with this

    I also need To add A Preview Play Button for the mp3 track uploaded by the users. Same link above

    You also want that to show on the product thumbnail and the single product page, as in when a user clicks on a product? Do you have a a system in place for the MP3 preview or do you also need a system for that?

    Also how can i make what it shows here http://musicmakerscity.com/ on the homepage as well

    Is though muscimakerscity your homepage?

    Pleasse advise.

    Thank you for being a WPMU DEV member!

    Kind Regards
    Jack.

  • pedro_jimenes
    • New Recruit

    Hi @Jack KitterHing

    Thank you for your brief response.

    With regards to the price and author of the product to show on hover of the thumbnail? And with this

    Yes, i have it like this http://musicmakerscity.com/store/products/, that's the layout that i want it to have on the Home page as well. Actually it can be a grid or list it doesn't really matter.

    You also want that to show on the product thumbnail and the single product page, as in when a user clicks on a product? Do you have a a system in place for the MP3 preview or do you also need a system for that

    Exactly, and i don't have the player yet. I have been looking into it but haven't found a suitable one yet, any suggestions?

    Also how can i make what it shows here http://musicmakerscity.com/ on the homepage as well

    Sorry that was a typo. Just ignore that is covered above XD.

  • Jack Kitterhing
    • Code Norris

    Hi there @pedro_jimenes

    I hope you are well today, sorry about the extreme delay on this, Somehow I missed your previous reply.

    Yes, i have it like this http://musicmakerscity.com/store/products/, that's the layout that i want it to have on the Home page as well. Actually it can be a grid or list it doesn't really matter.

    Sorry, could you clarify please? On the actual thumbnails themselves when hovered over, do you want the image to change to the price and a add to cart button, or have I got that wrong? Please advise.

    With regards to finding a MP3 player would something like this work for you http://wordpress.org/extend/plugins/mp3-jplayer/ ?

    Thank you! And Sorry again about the extreme delay, I do apologize about that.

    Kind Regards
    Jack.

  • pedro_jimenes
    • New Recruit

    Sorry, could you clarify please? On the actual thumbnails themselves when hovered over, do you want the image to change to the price and a add to cart button, or have I got that wrong? Please advise.

    Exactly like that.

    Don't worry about the delay :wink:

  • Jack Kitterhing
    • Code Norris

    Hi there @pedro_jimenes

    I hope you are well today and sorry about the extreme delay on this.

    I'm afraid out of the box this wouldn't be possible, I have been discussing this with a colleague, but the solutions would require custom coding.

    You could edit the thumbnail HTML and add a jQuery event, this could then link with a Javascript function that would then work in the same way as the add to cart button.

    Another option would be to add an additional DIV, that on hover of the image, a add to cart link comes up above the image or below.

    You may want to try posting a job on the WPMU DEV job board here https://premium.wpmudev.org/wpmu-jobs/

    Thank you, sorry again about the extreme delay, please let me know if I can be of any further assistance, I'm here to help.

    Kind Regards
    Jack.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.