Our team - HTML

Code: Select all

<div class="gkTeam" data-count="7">
<figure data-animation="horizontal" data-delay="0">
<a href="#"><img src="images/demo/Button-Info-icon.png" alt="" /></a>
<figcaption><a href="#">Mark</a></figcaption>
</figure>

how to change the code so that when you click on the photo mark the transition occurred here.
Where to insert a link?
Thank you.

Hi,

links goes here '#'
every time you will see in code # use your link, remember about SEF/SEO.
Links must be from menu (also from hidden menu) not from universe?

Got it.
I try to.
Thank you.

Code: Select all

<div class="gkTeam" data-count="7">
<figure data-animation="horizontal" data-delay="0">
<a href="#"><img src="images/demo/80/Button-Info-icon.png" alt="" />
</a><figcaption><a href="#index.php?option=com_zoo&view=category&layout=category">Mark</a></figcaption>
</figure>

there is no transition of the reference.
===
I need it to. When you click on the image, the user clicks the link in the right section of the site.
As it is properly set.
Help please.

Hmm, do you know basic of HTML?

When I said replace # with your links in means --> delete all # and in this place insert URL

Code: Select all

<div class="gkTeam" data-count="7">
<figure data-animation="horizontal" data-delay="0">
<a href="ndex.php?option=com_zoo&view=category&layout=category"><img src="images/demo/80/Button-Info-icon.png" alt="" />
</a><figcaption><a href="index.php?option=com_zoo&view=category&layout=category">Mark</a></figcaption>
</figure>

Source code is here:
https://www.gavick.com/documentation/wp ... frame=true

Remember to disable TinyMCE /JCE when you'll be changing that code.

when you click on the photo mark the transition occurred here.

About effect after click not (mouse) hover you have to use javascript, sorry but this is customization job.

Thank you, everything works.