Joomla Templates Club 406,261 posts

[tulioc Friend tuliocJoin date: March 2013Posts: 59Downloads:0Uploads:19 Thanks: 18 Thanked: 1 times in 1 posts]

#189480

HI there, need a hand.

Please see the image attached. Where can I find the “element style” for the arrow image circle by a red oval to change position and center it?
I looked on the avsallsharevideo.css but is not there.

Sorry for this question. But need someone to help me.

Thanks,

Tulio

---

Attachments:

1. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#501216

So that I can try to best assist you, please provide the url of the site you’re working on

[pb66 Friend pb66Join date: May 2010Posts: 129Downloads:23Uploads:10 Thanks: 31 Thanked: 42 times in 27 posts]

#501232

I’m not familiar with this module, but it appears that the styling will come from the module – not the template.

You look like you are using Firebug to locate the screenshot you have presented. Instead of loading it at the bottom of the screen, float it in a detached window.

On the right side you can see where the css is being inherited from -> this is where you can locate the property that is defining your style you want to change.

The attached screenshot is from the allsharevideo website and shows what I mean.

Hope this helps!

Regards,

---

Attachments:

1. 

1 user says Thank You to pb66 for this useful post

1. phong nam

[tulioc Friend tuliocJoin date: March 2013Posts: 59Downloads:0Uploads:19 Thanks: 18 Thanked: 1 times in 1 posts]

#501343

HI thanks for the replies.

I checked the avs css but is not there.

url: http://www.imagad.com/video-tutorials

Is the element that gives the arrow gif the position please check the image attached. 57.5 X 27

Thanks,

Tulio

---

Attachments:

1. 

[pb66 Friend pb66Join date: May 2010Posts: 129Downloads:23Uploads:10 Thanks: 31 Thanked: 42 times in 27 posts]

#501346

OK – Learning a lot here!

It appears to me that the formatting is being overwritten by an inline style which is why you can’t find it in the allvideoshare.css file.

If you go to modulesmod_allvideosharegallerytmpldefault_videos.php you will find the following code around line 43-46

<div class="avs_thumb" style="width:<?php echo $items['thumb_width']; ?>px;" onclick='javascript:location.href="<?php echo JRoute::_($link.$qs.'slg='.$videos[$i]->slug.'&orderby='.$items['orderby']); ?>"'>
<img class="arrow" src="<?php echo JURI::root(); ?>components/com_allvideoshare/assets/play.gif" border="0" style="margin-left:<?php echo ($items['thumb_width'] / 2) - 15; ?>px; margin-top:<?php echo ($items['thumb_height'] / 2) - 13; ?>px;" />
<img class="image" src="<?php echo $videos[$i]->thumb; ?>" style="width:<?php echo $items['thumb_width']; ?>px; height:<?php echo $items['thumb_height']; ?>px;" title="<?php echo JText::_('CLICK_TO_VIEW') . ' : ' . $videos[$i]->title; ?>" border="0" />
<span class="title"><?php echo $videos[$i]->title; ?></span>

Not that I claim to be able to read .php but this seems to say load the play.gif file. Then set the left margin at thumb_width /2 -15 and turn it into pixels.

Here
style="margin-left:<?php echo ($items['thumb_width'] / 2) - 15; ?>px;

Then the same for the margin-top.

I would suggest that changing this calculation will fix your issue. If you just want it centred I would remove the ‘-15’.

Hope this helps!

1 user says Thank You to pb66 for this useful post

1. tulioc

[tulioc Friend tuliocJoin date: March 2013Posts: 59Downloads:0Uploads:19 Thanks: 18 Thanked: 1 times in 1 posts]

#501406

Hi PB66, thanks, That makes the trick.

If is not a problem for you how did you find that so I can learn how to find it?

Regards,

Tulio

[pb66 Friend pb66Join date: May 2010Posts: 129Downloads:23Uploads:10 Thanks: 31 Thanked: 42 times in 27 posts]

#501410

It’s late and I’m ….

Use Firebug to look deeper into the code and where it comes from…. But I recently I installed an extension on Firefox called Web Devolper and it shows you things from slightly different metrics than Firebug. This lead me to looking at where the inline style as coming from..

Then installation on localhost and searching through the files found the relevant place.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#501430

Tulio:

Here’s a tutorial you may find helpful –> USING FIREBUG to CUSTOMIZE YOUR SITE

Hope That Helps

😎

[Author]

Posts