Joomla Templates Club 406,261 posts

[joomdude808 Friend joomdude808Join date: May 2013Posts: 64Downloads:3Uploads:0 Thanks: 7]

#191015

I am using JA Argo (K2) and I would like to add a bootstrap dropdown toggle button for links that I want to specify (i.e. login, contact, etc.).

I want the bootstrap dropdown button to float right of the Item Category display.

Here is a sample of bootstrap dropdown button I am referring to:
http://snag.gy/6Sqcd.jpg

[Wall Crasher Developer Wall CrasherJoin date: December 2011Posts: 1113Downloads:0Uploads:15 Thanks: 66 Thanked: 361 times in 300 posts]

#507617

Hi joomdude808,

If you login to your site, view the category blog menu item, you will see the dropdown you want.

http://www.clipular.com/c?5450857885728768=jtrctAku8U36OylUmij3e-bKpdY&f=.png

By open
templatesja_argohtmlcom_contentcategoryblog_item.php

You will see:

<div class="btn-group pull-right"> <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> <i class="icon-cog"></i> <span class="caret"></span> </a>
<ul class="dropdown-menu">
<?php if ($params->get('show_print_icon')) : ?>
<li class="print-icon"> <?php echo JHtml::_('icon.print_popup', $this->item, $params); ?> </li>
<?php endif; ?>
<?php if ($params->get('show_email_icon')) : ?>
<li class="email-icon"> <?php echo JHtml::_('icon.email', $this->item, $params); ?> </li>
<?php endif; ?>
<?php if ($canEdit) : ?>
<li class="edit-icon"> <?php echo JHtml::_('icon.edit', $this->item, $params); ?> </li>
<?php endif; ?>
</ul>
</div>

You can create the same dropdown or use the exsting one and add your link to it.

Hope it helps,

Regards

1 user says Thank You to Wall Crasher for this useful post

1. Saguaros

[joomdude808 Friend joomdude808Join date: May 2013Posts: 64Downloads:3Uploads:0 Thanks: 7]

#507871

Thank you, I found the code, modified it and applied it to my K2 template, here is the and position in the template

<?php if($this->item->params->get(‘itemTitle’)): ?>
<!– Item title –>
<div class=”btn-group pull-right”> <a class=”btn dropdown-toggle” data-toggle=”dropdown” href=”#”> <i class=”icon-cog”></i> <span class=”caret”></span> </a>
<ul class=”dropdown-menu”>
<li class=”share-icon”> <a href=”#” title=”Share” rel=”nofollow”><i class=”icon-share”></i> Share</a> </li>
<li class=”print-icon”> <a href=”#” title=”Print/PDF” rel=”nofollow”><i class=”icon-print”></i> PDF/Print</a> </li>
<li class=”envelope-icon”> <a href=”#” title=”Join Maining” rel=”nofollow”><i class=”icon-envelope”></i> Join Mailing</a> </li>
</ul>
</div> <h1 class=”itemTitle”>
<?php if(isset($this->item->editLink)): ?>
<!– Item edit link –>
<span class=”itemEditLink”>
<a class=”modal” rel=”{handler:’iframe’,size:{x:990,y:550}}” href=”<?php echo $this->item->editLink; ?>”>
<?php echo JText::_(‘K2_EDIT_ITEM’); ?>
</a>
</span>
<?php endif; ?>

<?php echo $this->item->title; ?>

<?php if($this->item->params->get(‘itemFeaturedNotice’) && $this->item->featured): ?>

It results in this…
http://imm.io/1hoyv

But I want it to look like the button the on NoNumbers demo page:
http://demo.nonumber.nl/index.php/3-tabs

More importantly, I want the gear and carat on the same line.

Please help…Thanks in Advance.

[Wall Crasher Developer Wall CrasherJoin date: December 2011Posts: 1113Downloads:0Uploads:15 Thanks: 66 Thanked: 361 times in 300 posts]

#507879

Hi joomdude808,

It is because the K2 css overwrite the default style of Bootstrap.
You need to overwrite again to get the Bootstrap style.

Create or use existing custom.css in css folder and add this style.

.caret {
display: inline-block !important;
}

Hope it helps,

Regards

1 user says Thank You to Wall Crasher for this useful post

1. Saguaros

[Author]

Posts