How To Add After Content-links-a, Content-links-b, And Content-links-c - Question | JoomShaper

How To Add After Content-links-a, Content-links-b, And Content-links-c

SC

Sean Carney

Template 1 year ago

<ul class="nav nav-tabs nav-stacked"> does NOT stack in Gazette template.

Using the Link A, Link B, and Link C Links and Text in the Images and Links tab from the Joomla content editor do not display properly in our Gazette template.

Here is an example page:

https://www.shalomadventure.com/torah/articles/this-fool-didn-t-know-when-to-stop

All three links are lining up side by side instead of on top of each other. Here is the html:

<ul class="nav nav-tabs nav-stacked">
<li class="content-links-a">
<a href="/somebrokenlinkgoingnowhere.com" target="_blank" rel="nofollow noopener noreferrer">Test Link A</a> </li>
<li class="content-links-b">
<a href="/somebrokenlinkgoingnowhere.com" target="_blank" rel="nofollow noopener noreferrer">Test Link B</a> </li>
<li class="content-links-c">
<a href="/somebrokenlinkgoingnowhere.com" target="_blank" rel="nofollow noopener noreferrer">Test Link C</a> </li>
</ul>

These three links all need to appear on separate lines instead of all on one line. Here is a link to see them side by side if I use short strings of text for the hyperlinks:

https://drive.google.com/file/d/1FpwsuxFEfekLKgL217ZtSyTzAVGLZ6_V/view?usp=sharing

Once these links display on separate lines, the need to not be so crowded so that Google won't ding us for having the text too close. It would be nice to have a paragraph tag after each line. Here you can see where the three links on separate lines by making the strings of text extremely long but they are still very crowed height wise:

https://drive.google.com/file/d/1pGf_c7ObghKomozOf4gM4h-qBFbNHXAR/view?usp=sharing

Is this something that needs to be changed in the template code?

Thanks,

Sean Carney

0
3 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 year ago #110271

Hi there!

Thanks for contacting us.

Please use the following code in your custom CSS:

.content-links ul.nav.nav-tabs.nav-stacked {
    flex-direction: column;
}

Note: Path towards custom CSS(Joomla 3): Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

Hope this will solve the issue for you!

Best Regards

0
SC
Sean Carney
Accepted Answer
1 year ago #110279

That was just what I needed. Thank you.

Sean

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 year ago #110302

Glad to know that and you are always welcome:)

0