Keyword

Using JW Tabs and Slides to conceal k2 divs

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 3 weeks ago #82212 by Marty Peet
I have been attempting to use the JW Tabs and Slides plugin to 'hide' the Comments and Extra Info blocks within k2. I wanted an area title, e.g. View Additional Information, that when clicked would show the Comments and Extra Info block using the slide transition. Instructions for how I did it are attached, effect can be seen at

Slide Comments

Scroll down the page until you see the View Additional Information and View/Add Item Comments, click on either/both of those links and see how it works. To do the following you MUST have the JWTS Tabs and Slides in content items installed. It can be downloaded here:

www.joomlaworks.gr/content/view/15/42/

Hope it's useful to someone out there in k2 land

I've updated the attached text file with an extra comment to make it easier to use... you MUST change the paths to the js files to suit your site ESPECIALLY line 6 (import directive) in the attached file.
Attachments:

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82213 by william white
Replied by william white on topic Using JW Tabs and Slides to conceal k2 divs
Nice!, i assume you wrapped the div in item.php with {slide=My first slide in Joomla!}
div code here
{/slide}

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 3 weeks ago #82214 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey William, nope, I tried that and k2, or something strips the code. If you download the attached text file you'll see what needs to be done.

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82215 by william white
Replied by william white on topic Using JW Tabs and Slides to conceal k2 divs
thanks!@

Marty Peet said:Hey William, nope, I tried that and k2, or something strips the code. If you download the attached text file you'll see what needs to be done.

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82216 by AdrianK
Replied by AdrianK on topic Using JW Tabs and Slides to conceal k2 divs
Have a look on the gavic tabs please

tools.gavick.com/

I think its better.

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 3 weeks ago #82217 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey Titus, not sure what your comment means, but thanks for posting it anyway... I was merely trying to find a way to 'hide' the display of some of the k2 divs. The example shown uses the JW Tabs and Slides slide function, tabs would be just as simple and a simple CSS class or styling to the link could make it look however you wanted.

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82218 by AdrianK
Replied by AdrianK on topic Using JW Tabs and Slides to conceal k2 divs
Hi Marty Peet,

I think I will code this function in the next 2 months using mootools.

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82219 by FeSys
Many Thanks " Marty Peet".
Your idea is safe, clean, and simple..
I do like it. Keep good idea
Thanks for sharing this nice tips.

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 3 weeks ago #82220 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Great idea Titus, seem to have less 'problems' with JQuery in Joomla than Mootools? just a thought

Please Log in or Create an account to join the conversation.

More
15 years 3 weeks ago #82221 by AdrianK
Replied by AdrianK on topic Using JW Tabs and Slides to conceal k2 divs
I can use both js frameworks, but mootools is native and should be used.

If you want to use JQuery anytime take a look on this plugin:

extensions.joomla.org/extensions/core-enhancements/scripts/7230?qh=YTo0OntpOjA7czo2OiJqcXVlcnkiO2k6MTtzOjY6InBsdWdpbiI7aToyO3M6NzoicGx1Z2lucyI7aTozO3M6MTM6ImpxdWVyeSBwbHVnaW4iO30%3D

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 2 weeks ago #82222 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey Titus, thanks for the heads up on the JQuery no conflict extension, brilliant!!!

Please Log in or Create an account to join the conversation.

More
15 years 2 days ago #82223 by pocasolta
Replied by pocasolta on topic Using JW Tabs and Slides to conceal k2 divs
hello Marty,
great post! thanks for sharing with us!
I've been looking for a way of doing the same but with tabs instead of slides (using the same TS plugin)... I just want the extended categories, image gallery and video sections sorted in tabs instead of "hidden" in slides...
do you think it's easy to change the code for tabs?
thanks in advance!

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 2 days ago #82224 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey Pocasolta, shouldn't be too difficult, I have noticed with implementing it the way I have that you CAN'T use the {tab=whatever} links within any articles that use the changed item.php. To do the tab thing I'd create a page with tab content in it (not one using the item.php), view the source and make the changes as needed. Good luck!!!

Please Log in or Create an account to join the conversation.

More
15 years 2 days ago #82225 by william white
Replied by william white on topic Using JW Tabs and Slides to conceal k2 divs
Does this code in your script make it dependent on this site?
$document->addScript("template.sin-iqual.com/plugins/content/plugin_jw_ts/tabs_slides_comp.js");
$document->addScript("template.sin-iqual.com/plugins/content/plugin_jw_ts/tabs_slides_def_loader.js");

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 2 days ago #82226 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Yep, sorry about that I thought that I'd commented in the text file to change those lines to suit your site, obviously pointing to the location of the tabs_slides_comp and def_loader scipts

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 2 days ago #82227 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey William, updated/added a new tabsandslides.txt file with an extra comment to make it easier to use ;-]

Please Log in or Create an account to join the conversation.

More
15 years 2 days ago #82228 by william white
Replied by william white on topic Using JW Tabs and Slides to conceal k2 divs
Got it! Brain Crud for me.
also, the {before} and {after} code must be inside the to work
thanks
Nice addition!

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 1 day ago #82229 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Don't know what you guys will thinks of this, it's interesting though? been playing some more with this functionality. I've done the following:

1) created a k2 overrides template
2) wrapped the entire category_item.php file in the before/after code for the slide component
3) created a menu link to the category view and....

have a look at the layout here. Click on the Experts menu option and then the list of names below the image. The layout is controlled by the k2 item in a category layout options, accessible via the k2 administrative interface. As you increase the number of columns for the primary items you get more columns of names/links/sliders. Not sure what use it'll be put to in the future, however, it does open up other options of displaying content. Perhaps someone could code it to display the entire span e.g. if 3 columns are selected in the layout settings, then all those items are displayed when one of the links is clicked....

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 1 day ago #82230 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Forgot the link ;-[

template.sin-iqual.com/index.php?option=com_k2&view=itemlist&layout=category&task=category&id=5&Itemid=4

Marty Peet said:Don't know what you guys will thinks of this, it's interesting though? been playing some more with this functionality. I've done the following:

1) created a k2 overrides template
2) wrapped the entire category_item.php file in the before/after code for the slide component
3) created a menu link to the category view and....

have a look at the layout here. Click on the Experts menu option and then the list of names below the image. The layout is controlled by the k2 item in a category layout options, accessible via the k2 administrative interface. As you increase the number of columns for the primary items you get more columns of names/links/sliders. Not sure what use it'll be put to in the future, however, it does open up other options of displaying content. Perhaps someone could code it to display the entire span e.g. if 3 columns are selected in the layout settings, then all those items are displayed when one of the links is clicked....

Please Log in or Create an account to join the conversation.

  • Marty Peet
  • Marty Peet's Avatar Topic Author
  • Offline
  • Premium Member
More
15 years 1 hour ago #82231 by Marty Peet
Replied by Marty Peet on topic Using JW Tabs and Slides to conceal k2 divs
Hey Pocasolta, was wondering how you got on with implementing tabs? I've had a bit of a play, look at this page:

template.sin-iqual.com/index.php?option=com_k2&view=itemlist&layout=category&task=category&id=5&Itemid=4

Please forgive the layout/look, working on function not form at the moment ;-] This is what I've done:

1) In Joomla/k2 created an Experts category
2) Created 6 subcategories of Experts, Accounting, Finance, Marketing, Management, Strategy and Business Information Technology
3) In the Experts category page created 2 MANUALLY entered tab contents, Overview and Working with our Experts
4) Create a template for the Experts category and sub-categories
5) Edited the category.php file so that it displays ALL sub-categories in tabs
6) Edited the item.php file so that all content for displays in slides
6) Created a menu link to the top level Experts category

Some of that functionality should be useful. If you have a top level category that contains a few sub-categories the changes to the category.php file will create the tabs on the fly and name them the same name as the sub-category. Haven't tried to see what will happen if you have more categories than the div/width will handle. Hope this is of some help to you

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum