blog documentation FAQ followers forum marketplace services youtube

[AudioPro] On Sale Now thumbnail too big

The Jamroom Network » Forum » Design and Skin Customization » Page » [AudioPro] On Sale Now thumbnail too big
music412
@music412
6 years ago
36 posts
Hello everyone

I have just installed the Audio Pro skin and would like to reduce the size of the "On Sale Now" thumbnail when viewed on the mobile phone. It looks fine on the desktop.

I have attached the screenshot for reference.

LEFT is the current look.
RIGHT is what I would like to have.
updated by @music412: 09/17/18 05:30:41PM
paul
@paul
6 years ago
4,325 posts
The easiest way would be to locate the template where that image is displayed then add the following condition to the call -

{if jrCore_is_mobile_device()}
    // Show the image call with a smaller width specified
{else}
    // Show the default image size
{/if}

Let me know the URL of where you are seeing this and I'll let you know which template to edit.
hth


--
Paul Asher - JR Developer and System Import Specialist
music412
@music412
6 years ago
36 posts
Hi Paul

It is on the homepage when viewed on a mobile phone.

http://music412.com/
douglas
@douglas
6 years ago
2,767 posts
You'll find the code in you index_item_1.tpl.

So using Paul's code it would look something like this:

{if jrCore_is_mobile_device()}
    {jrCore_module_function
    function="jrImage_display"
    module="jrAudio"
    type="audio_image"
    item_id=$item._item_id
    size="xlarge"
    crop="auto"
    class="img_scale"
    alt=$item.audio_title
    width=72
    height=72
    }{else}
    {jrCore_module_function
    function="jrImage_display"
    module="jrAudio"
    type="audio_image"
    item_id=$item._item_id
    size="xlarge"
    crop="auto"
    class="img_scale"
    alt=$item.audio_title
    width=false
    height=false
    }{/if}

Hope this helps!


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos
music412
@music412
6 years ago
36 posts
Hi Douglas . I have added the code but there seems no difference.
douglas
@douglas
6 years ago
2,767 posts
Change it to this:

{if jrCore_is_mobile_device()}
    {jrCore_module_function
    function="jrImage_display"
    module="jrAudio"
    type="audio_image"
    item_id=$item._item_id
    size="xlarge"
    crop="auto"
    class="img_scale"
    alt=$item.audio_title
    style="max-width:72px;max-height:72px;"
    }{else}
    {jrCore_module_function
    function="jrImage_display"
    module="jrAudio"
    type="audio_image"
    item_id=$item._item_id
    size="xlarge"
    crop="auto"
    class="img_scale"
    alt=$item.audio_title
    width=false
    height=false
    }{/if}

Hope this helps!


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos
music412
@music412
6 years ago
36 posts
Hi Douglas

Thanks for your help.

The code works!

But the layout still looks kinda not right.

See the attached print screen.

Will "Audio Pro" template continue to be improved? There are a few things that I have came across which could be bugs.
douglas
@douglas
6 years ago
2,767 posts
music412:
Hi Douglas

Thanks for your help.

The code works!

But the layout still looks kinda not right.

See the attached print screen.

Will "Audio Pro" template continue to be improved? There are a few things that I have came across which could be bugs.


You'll want to modify the index_item_1.tpl file in order to get the desired layout you want.

Hope this helps!


--

Douglas Hackney
Jamroom Team - Designer/Developer/Support
FAQ-Docs-Help Videos

Tags