Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • renejdm Friend
    #180391

    Hi,

    In a K2 article the font sizer is at the bottom of the article. I think it should be at the top of the article.

    My question is: how do you move (or copy) the font sizer toolbar so that it is above the text article?

    See image for clarification.

    Does anyone know how to do this?

    Rene


    1. JA-Lens-Move-Font-Sizer
    Ninja Lead Moderator
    #466098

    Hi Rene

    Open templates/ja_lens/html/com_k2/ja_lens/item.php and cut this script below

    <ul>
    <?php if($this->item->params->get('itemFontResizer')): ?>
    <!-- Font Resizer -->
    <li>
    <span class="itemTextResizerTitle"><?php echo JText::_('K2_FONT_SIZE'); ?></span>
    <a href="#" id="fontDecrease">
    <span><?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?>" />
    </a>
    <a href="#" id="fontIncrease">
    <span><?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?>" />
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemPrintButton') && !JRequest::getInt('print')): ?>
    <!-- Print Button -->
    <li>
    <a class="itemPrintLink" rel="nofollow" href="<?php echo $this->item->printLink; ?>" onclick="window.open(this.href,'printWindow','width=900,height=600,location=no,menubar=no,resizable=yes,scrollbars=yes'); return false;">
    <span><?php echo JText::_('K2_PRINT'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemEmailButton') && !JRequest::getInt('print')): ?>
    <!-- Email Button -->
    <li>
    <a class="itemEmailLink" rel="nofollow" href="<?php echo $this->item->emailLink; ?>" onclick="window.open(this.href,'emailWindow','width=400,height=350,location=no,menubar=no,resizable=no,scrollbars=no'); return false;">
    <span><?php echo JText::_('K2_EMAIL'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemSocialButton') && !is_null($this->item->params->get('socialButtonCode', NULL))): ?>
    <!-- Item Social Button -->
    <li>
    <?php echo $this->item->params->get('socialButtonCode'); ?>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemVideoAnchor') && !empty($this->item->video)): ?>
    <!-- Anchor link to item video below - if it exists -->
    <li>
    <a class="itemVideoLink k2Anchor" href="<?php echo $this->item->link; ?>#itemVideoAnchor"><?php echo JText::_('K2_MEDIA'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemImageGalleryAnchor') && !empty($this->item->gallery)): ?>
    <!-- Anchor link to item image gallery below - if it exists -->
    <li>
    <a class="itemImageGalleryLink k2Anchor" href="<?php echo $this->item->link; ?>#itemImageGalleryAnchor"><?php echo JText::_('K2_IMAGE_GALLERY'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemCommentsAnchor') && $this->item->params->get('itemComments') && ( ($this->item->params->get('comments') == '2' && !$this->user->guest) || ($this->item->params->get('comments') == '1')) ): ?>
    <!-- Anchor link to comments below - if enabled -->
    <li>
    <?php if(!empty($this->item->event->K2CommentsCounter)): ?>
    <!-- K2 Plugins: K2CommentsCounter -->
    <?php echo $this->item->event->K2CommentsCounter; ?>
    <?php else: ?>
    <?php if($this->item->numOfComments > 0): ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <span><?php echo $this->item->numOfComments; ?></span> <?php echo ($this->item->numOfComments>1) ? JText::_('K2_COMMENTS') : JText::_('K2_COMMENT'); ?>
    </a>
    <?php else: ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <?php echo JText::_('K2_BE_THE_FIRST_TO_COMMENT'); ?>
    </a>
    <?php endif; ?>
    <?php endif; ?>
    </li>
    <?php endif; ?>
    </ul>

    and paste to before <!– Plugins: AfterDisplayTitle –>

    <div class="itemToolbar">
    <ul>
    <?php if($this->item->params->get('itemFontResizer')): ?>
    <!-- Font Resizer -->
    <li>
    <span class="itemTextResizerTitle"><?php echo JText::_('K2_FONT_SIZE'); ?></span>
    <a href="#" id="fontDecrease">
    <span><?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?>" />
    </a>
    <a href="#" id="fontIncrease">
    <span><?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?>" />
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemPrintButton') && !JRequest::getInt('print')): ?>
    <!-- Print Button -->
    <li>
    <a class="itemPrintLink" rel="nofollow" href="<?php echo $this->item->printLink; ?>" onclick="window.open(this.href,'printWindow','width=900,height=600,location=no,menubar=no,resizable=yes,scrollbars=yes'); return false;">
    <span><?php echo JText::_('K2_PRINT'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemEmailButton') && !JRequest::getInt('print')): ?>
    <!-- Email Button -->
    <li>
    <a class="itemEmailLink" rel="nofollow" href="<?php echo $this->item->emailLink; ?>" onclick="window.open(this.href,'emailWindow','width=400,height=350,location=no,menubar=no,resizable=no,scrollbars=no'); return false;">
    <span><?php echo JText::_('K2_EMAIL'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemSocialButton') && !is_null($this->item->params->get('socialButtonCode', NULL))): ?>
    <!-- Item Social Button -->
    <li>
    <?php echo $this->item->params->get('socialButtonCode'); ?>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemVideoAnchor') && !empty($this->item->video)): ?>
    <!-- Anchor link to item video below - if it exists -->
    <li>
    <a class="itemVideoLink k2Anchor" href="<?php echo $this->item->link; ?>#itemVideoAnchor"><?php echo JText::_('K2_MEDIA'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemImageGalleryAnchor') && !empty($this->item->gallery)): ?>
    <!-- Anchor link to item image gallery below - if it exists -->
    <li>
    <a class="itemImageGalleryLink k2Anchor" href="<?php echo $this->item->link; ?>#itemImageGalleryAnchor"><?php echo JText::_('K2_IMAGE_GALLERY'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemCommentsAnchor') && $this->item->params->get('itemComments') && ( ($this->item->params->get('comments') == '2' && !$this->user->guest) || ($this->item->params->get('comments') == '1')) ): ?>
    <!-- Anchor link to comments below - if enabled -->
    <li>
    <?php if(!empty($this->item->event->K2CommentsCounter)): ?>
    <!-- K2 Plugins: K2CommentsCounter -->
    <?php echo $this->item->event->K2CommentsCounter; ?>
    <?php else: ?>
    <?php if($this->item->numOfComments > 0): ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <span><?php echo $this->item->numOfComments; ?></span> <?php echo ($this->item->numOfComments>1) ? JText::_('K2_COMMENTS') : JText::_('K2_COMMENT'); ?>
    </a>
    <?php else: ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <?php echo JText::_('K2_BE_THE_FIRST_TO_COMMENT'); ?>
    </a>
    <?php endif; ?>
    <?php endif; ?>
    </li>
    <?php endif; ?>
    </ul>
    </div>

    with change css file

    <blockquote>Open templates/ja_lens/css/k2.css</blockquote>

    from

    .BlogView div.itemToolbar {
    margin-bottom: 0px !important;
    float: left;
    width: 50%;
    border-top: 1px solid #e5e5e5
    }

    change to

    .BlogView div.itemToolbar {
    margin-bottom: 0px !important;
    float: left;
    border-top: 1px solid #e5e5e5
    }

    from

    .itemView .article-info {
    margin-bottom: 10px;
    padding-left: 30px;
    border-bottom: solid 1px #ddd
    }

    change to

    .itemView .article-info {
    margin-bottom: 10px;
    padding-left: 30px;
    float: left;
    border-bottom: solid 1px #ddd
    }

    Regards

    renejdm Friend
    #466119

    Hi Ninja Lead,

    Thanks for your reply. However the results were not as expected. When I looked at the css I would need to modify to get this to look good, it turns out to be overwhelming.

    Rne

    Ninja Lead Moderator
    #466145

    Did you fix yet? If you have still the error please send PM me with URL, admin access and FTP account. I will help you out of

    renejdm Friend
    #466394

    Hi Ninja Lead,

    After applying the fix I get a few CSS issues (mainly to do with .toolbar). See attached.

    Rene

    Also, I removed the print and email code and left them at the bottom:

    Image before fix:

    Image after fix:

    Also, this is only for JA_Lens. The fixes would also have to be applied to JA_Lens_Blog


    1. toolbar_problems2
    2. bottom_toolbar_before_fix
    3. bottom_toolbar_after_fix
    Ninja Lead Moderator
    #466468

    Try to this fix again. Please back to default my fix before everything: html and css

    <blockquote>Open templates/ja_lens/html/com_k2/ja_lens/item.php and cut this script below</blockquote>

    <ul>
    <?php if($this->item->params->get('itemFontResizer')): ?>
    <!-- Font Resizer -->
    <li>
    <span class="itemTextResizerTitle"><?php echo JText::_('K2_FONT_SIZE'); ?></span>
    <a href="#" id="fontDecrease">
    <span><?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?>" />
    </a>
    <a href="#" id="fontIncrease">
    <span><?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?>" />
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemPrintButton') && !JRequest::getInt('print')): ?>
    <!-- Print Button -->
    <li>
    <a class="itemPrintLink" rel="nofollow" href="<?php echo $this->item->printLink; ?>" onclick="window.open(this.href,'printWindow','width=900,height=600,location=no,menubar=no,resizable=yes,scrollbars=yes'); return false;">
    <span><?php echo JText::_('K2_PRINT'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemEmailButton') && !JRequest::getInt('print')): ?>
    <!-- Email Button -->
    <li>
    <a class="itemEmailLink" rel="nofollow" href="<?php echo $this->item->emailLink; ?>" onclick="window.open(this.href,'emailWindow','width=400,height=350,location=no,menubar=no,resizable=no,scrollbars=no'); return false;">
    <span><?php echo JText::_('K2_EMAIL'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemSocialButton') && !is_null($this->item->params->get('socialButtonCode', NULL))): ?>
    <!-- Item Social Button -->
    <li>
    <?php echo $this->item->params->get('socialButtonCode'); ?>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemVideoAnchor') && !empty($this->item->video)): ?>
    <!-- Anchor link to item video below - if it exists -->
    <li>
    <a class="itemVideoLink k2Anchor" href="<?php echo $this->item->link; ?>#itemVideoAnchor"><?php echo JText::_('K2_MEDIA'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemImageGalleryAnchor') && !empty($this->item->gallery)): ?>
    <!-- Anchor link to item image gallery below - if it exists -->
    <li>
    <a class="itemImageGalleryLink k2Anchor" href="<?php echo $this->item->link; ?>#itemImageGalleryAnchor"><?php echo JText::_('K2_IMAGE_GALLERY'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemCommentsAnchor') && $this->item->params->get('itemComments') && ( ($this->item->params->get('comments') == '2' && !$this->user->guest) || ($this->item->params->get('comments') == '1')) ): ?>
    <!-- Anchor link to comments below - if enabled -->
    <li>
    <?php if(!empty($this->item->event->K2CommentsCounter)): ?>
    <!-- K2 Plugins: K2CommentsCounter -->
    <?php echo $this->item->event->K2CommentsCounter; ?>
    <?php else: ?>
    <?php if($this->item->numOfComments > 0): ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <span><?php echo $this->item->numOfComments; ?></span> <?php echo ($this->item->numOfComments>1) ? JText::_('K2_COMMENTS') : JText::_('K2_COMMENT'); ?>
    </a>
    <?php else: ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <?php echo JText::_('K2_BE_THE_FIRST_TO_COMMENT'); ?>
    </a>
    <?php endif; ?>
    <?php endif; ?>
    </li>
    <?php endif; ?>
    </ul>

    and paste to below

    <!-- Item Hits -->
    <span class="itemHits">
    <label><?php echo JText::_('K2_LENS_READ'); ?></label> <?php echo $this->item->hits; ?> <?php echo JText::_('K2_TIMES'); ?>
    </span>
    <?php endif; ?>

    <div class="article-info clearfix">

    <?php if($this->item->params->get('itemAuthor')): ?>
    <!-- Item Author -->
    <span class="itemAuthor">
    <?php echo JText::_('by'); ?>
    <?php if(empty($this->item->created_by_alias)): ?>
    <a rel="author" href="<?php echo $this->item->author->link; ?>"><?php echo $this->item->author->name; ?></a>
    <?php else: ?>
    <?php echo $this->item->author->name; ?>
    <?php endif; ?>
    </span>
    <?php endif; ?>

    <?php if($this->item->params->get('itemCategory')): ?>
    <!-- Item category -->
    <span class="itemCategory">
    <label><?php echo JText::_('K2_LENS_PUBLISHED_IN'); ?></label>
    <a href="<?php echo $this->item->category->link; ?>"><?php echo $this->item->category->name; ?></a>
    </span>
    <?php endif; ?>

    <?php if($this->item->params->get('itemDateCreated')): ?>
    <span class="itemDate">
    <label><?php echo JText::_('K2_LENS_CREATED_DATE'); ?></label>
    <?php echo JHTML::_('date', $this->item->created , JText::_('DATE_FORMAT_LC3')); ?>
    </span>
    <?php endif; ?>
    <?php if($this->item->params->get('itemHits')): ?>
    <!-- Item Hits -->
    <span class="itemHits">
    <label><?php echo JText::_('K2_LENS_READ'); ?></label> <?php echo $this->item->hits; ?> <?php echo JText::_('K2_TIMES'); ?>
    </span>
    <?php endif; ?>

    <div class="itemToolbar">

    <ul>
    <?php if($this->item->params->get('itemFontResizer')): ?>
    <!-- Font Resizer -->
    <li>
    <span class="itemTextResizerTitle"><?php echo JText::_('K2_FONT_SIZE'); ?></span>
    <a href="#" id="fontDecrease">
    <span><?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_DECREASE_FONT_SIZE'); ?>" />
    </a>
    <a href="#" id="fontIncrease">
    <span><?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?></span>
    <img src="<?php echo JURI::root(true); ?>/components/com_k2/images/system/blank.gif" alt="<?php echo JText::_('K2_INCREASE_FONT_SIZE'); ?>" />
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemPrintButton') && !JRequest::getInt('print')): ?>
    <!-- Print Button -->
    <li>
    <a class="itemPrintLink" rel="nofollow" href="<?php echo $this->item->printLink; ?>" onclick="window.open(this.href,'printWindow','width=900,height=600,location=no,menubar=no,resizable=yes,scrollbars=yes'); return false;">
    <span><?php echo JText::_('K2_PRINT'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemEmailButton') && !JRequest::getInt('print')): ?>
    <!-- Email Button -->
    <li>
    <a class="itemEmailLink" rel="nofollow" href="<?php echo $this->item->emailLink; ?>" onclick="window.open(this.href,'emailWindow','width=400,height=350,location=no,menubar=no,resizable=no,scrollbars=no'); return false;">
    <span><?php echo JText::_('K2_EMAIL'); ?></span>
    </a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemSocialButton') && !is_null($this->item->params->get('socialButtonCode', NULL))): ?>
    <!-- Item Social Button -->
    <li>
    <?php echo $this->item->params->get('socialButtonCode'); ?>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemVideoAnchor') && !empty($this->item->video)): ?>
    <!-- Anchor link to item video below - if it exists -->
    <li>
    <a class="itemVideoLink k2Anchor" href="<?php echo $this->item->link; ?>#itemVideoAnchor"><?php echo JText::_('K2_MEDIA'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemImageGalleryAnchor') && !empty($this->item->gallery)): ?>
    <!-- Anchor link to item image gallery below - if it exists -->
    <li>
    <a class="itemImageGalleryLink k2Anchor" href="<?php echo $this->item->link; ?>#itemImageGalleryAnchor"><?php echo JText::_('K2_IMAGE_GALLERY'); ?></a>
    </li>
    <?php endif; ?>

    <?php if($this->item->params->get('itemCommentsAnchor') && $this->item->params->get('itemComments') && ( ($this->item->params->get('comments') == '2' && !$this->user->guest) || ($this->item->params->get('comments') == '1')) ): ?>
    <!-- Anchor link to comments below - if enabled -->
    <li>
    <?php if(!empty($this->item->event->K2CommentsCounter)): ?>
    <!-- K2 Plugins: K2CommentsCounter -->
    <?php echo $this->item->event->K2CommentsCounter; ?>
    <?php else: ?>
    <?php if($this->item->numOfComments > 0): ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <span><?php echo $this->item->numOfComments; ?></span> <?php echo ($this->item->numOfComments>1) ? JText::_('K2_COMMENTS') : JText::_('K2_COMMENT'); ?>
    </a>
    <?php else: ?>
    <a class="itemCommentsLink k2Anchor" href="<?php echo $this->item->link; ?>#itemCommentsAnchor">
    <?php echo JText::_('K2_BE_THE_FIRST_TO_COMMENT'); ?>
    </a>
    <?php endif; ?>
    <?php endif; ?>
    </li>
    <?php endif; ?>
    </ul>
    </div>

    </div>

    with change css file

    <blockquote>Open templates/ja_lens/css/k2.css</blockquote>

    .BlogView .article-info div.itemToolbar {
    width: auto !important;
    margin-top: 7px;
    border: none !important;
    }

    .BlogView .article-info div.itemToolbar ul {
    margin: 0px;
    border: none ! important;
    }
    .BlogView .article-info div.itemToolbar ul li span.itemTextResizerTitle {
    padding: 0px;
    font-size: 95%;
    }

    .BlogView .article-info div.itemToolbar span,
    .BlogView .article-info div.itemToolbar ul li {
    border: none;
    padding: 0px;
    line-height: normal;
    }

    With JA_Lens_Blog you are only change structure html file

    <blockquote>templates/ja_lens/html/com_k2/ja_lens_blog/item.php</blockquote>

    renejdm Friend
    #466961

    Hi Ninja Lead,

    Thanks for your reply. I tried the fixes you supplied but unfortunately they do not look good. I think this is very difficult to achieve.

    Rene

    Ninja Lead Moderator
    #466975

    Hi Rene,

    Please send PM me with URL, admin access and ftp account. I will help you out of.

    Regards

    renejdm Friend
    #467103

    Hi NinjaLead,

    I private messaged you the admin access.

    I also sent some more details of what I want. I (preferably) would like to copy the font minimize icon and the font maximize icon to the top. This way there would be 2 places to change the size of the font. If this is not possible, then I would like to move only the plus and minus icons from the bottom to the top and leave the email and print icons at the bottom where they currently exist.

    Thanks for looking into this.

    Rene

    Ninja Lead Moderator
    #467167

    @renejdm: i fixed the same your request on your site, please check on your site again.

    renejdm Friend
    #467256

    Wow Ninja Lead,

    That is amazing! The Font Sizer toolbar is now where it should have always been. There is one slight problem. The font sizer toolbar is no longer responsive. see attached image.

    Rene


    1. JA-Lens-Font-Sizer-not-responsive
    Ninja Lead Moderator
    #467361

    How can i reproduce the error on your site, i tried in vain to duplicate it. Please send me the error url for further look.

    http://petdietdesigner.net/item/23-organize-your-recipes

    renejdm Friend
    #467406

    Hi Ninja Lead,

    Just go to the page in the above link and minimize your browser so that it is approximately the width of a data mobile phone in portrait mode.

    Rene

    Ninja Lead Moderator
    #467473

    With mobile layout

    <blockquote>Open templates/ja_lens/css/layout-mobile.css</blockquote>

    and add the following script:

    .BlogView .article-info div.itemToolbar {
    width: 100% !important;
    }

    The problem on mobile layout will be fixed.

    renejdm Friend
    #467523

    Hi Ninja Lead,

    That is great. Now it looks amazing. Thanks.

    But I would like to be able to re-apply these code changes when updating the Lens template. Also, I tried to duplicate this on my localhost and I must be missing some codes fixes because I was not entirely successful. Also, I am sure other people in this forum would appreciate the entire code to duplicate moving the font sizer toolbar.

    So please can you post the final code fixes for this?

    Thanks a million,

    Rene

Viewing 15 posts - 1 through 15 (of 17 total)

This topic contains 17 replies, has 2 voices, and was last updated by  renejdm 12 years ago.

We moved to new unified forum. Please post all new support queries in our New Forum