| Re: Peekays Tab Hack for Content 0.5 |
| by Peekay on 2007/1/29 23:21:12 Pretty Tabs for Content 0.5/6 - Silver Grad This is a modified version of my original no-image CSS tabs. * It uses just one image (less than 1 KB). * It uses an accessible, unordered list to create the tabs. * It works for me in IE6 (PC), Firefox (PC, Mac, Linux) Safari (Mac).  To use the tabs: 1) Install the tab hack. 2) Right-click on the image below (ctrl-click on a Mac) and choose 'Save image to disc'. Save the image as 'tabs_silver_grad.gif'. .....  3) Upload 'tabs_silver_grad.gif' to your Xoops/uploads directory. 4) Replace the Content module's 'ct_index.html' template with the code below (make a backup first). 5) In XOOPS admin/system/modules UPDATE the Content module to load the new template into the DB. le="color: #000000"><?php <!-- Peekays Tab Hack Template : Silver Grad --> <!-- Upload tabs_silver_grad.gif to /uploads --> <style type="text/css"> #tabmenu { color: #000000; border-bottom: 1px solid #666666; margin: 12px 0px 0px 0px; padding: 0px; z-index: 1; padding-left: 10px } #tabmenu li { display: inline; overflow: hidden; list-style-type: none; } #tabmenu a, a.active { color: #000000; background: #ffffff url("<{$xoops_url}>/uploads/tabs_silver_grad.gif") repeat-x left top; font-family: Verdana, Arial, sans-serif; font-size: 11px; font-weight: bold; line-height: 2.0; border: 1px solid #666666; margin: 0; text-decoration: none; } /* For IE */ #tabmenu a, a.active { padding: 4px 5px 4px 5px;} /* and for other browsers */ html>body #tabmenu a, a.active { padding: 4px 5px 5px 5px;} #tabmenu a.active { background: #ffffff; /* Border bottom same colour as active page */ border-bottom: 1px solid #ffffff; } #tabmenu a:hover { color: #000000; background: #ffffff url("<{$xoops_url}>/uploads/tabs_silver_grad.gif") repeat-x left top; text-decoration: underline } #tabmenu a:visited { color: #000000; } #tabmenu a.active:hover { background: transparent; color: #000000; } #tabcontent { font: 0.9em/1.3em verdana, arial, sans-serif; background: #ffffff; padding: 20px; border: 1px solid #666666; border-top: none; z-index: 2; } #tabcontent a { text-decoration: none; } #tabcontent a:hover { background: transparent; } </style> <!-- Start unordered list loop --> <ul id="tabmenu"> <{foreach item=tab from=$tabs}> <li><{if $tab.storyid == $id}><a class="active" href="index.php?id=<{$tab.storyid}>"><{$tab.title}></a> <{else}><{if $tab.storyid != $id}> <a href="index.php?id=<{$tab.storyid}>"><{$tab.title}></a><{/if}><{/if}></li> <{/foreach}> </ul> <!-- End item loop --> <div id="tabcontent"> <{$content}> </div> <{if $xoops_isadmin == 1}> <div align="right"><a href="<{$xoops_url}>/modules/content/admin/index.php?op=submit&return=1&id=<{$id}>"><img src="<{$xoops_url}>/modules/content/images/add.gif" alt="" border="0" align="absmiddle"></a> <a href="<{$xoops_url}>/modules/content/admin/index.php?op=edit&id=<{$id}>&return=1"><img src="<{$xoops_url}>/modules/content/images/edit.gif" alt="" border="0" align="absmiddle"></a></div> <{/if}> <div class="printandemail"> <a href="print.php?id=<{$id}>" target="_new"><img src="<{$xoops_url}>/modules/content/images/print.gif" alt="" width="16" height="16" border="0" align="absmiddle"></a> <a href="<{$mail_link}>"><img src="<{$xoops_url}>/modules/content/images/email.gif" alt="" width="16" height="10" border="0" align="absmiddle"></a></div> </div> <{if $nocomments == 0}> <br /><br /> <div style="text-align: center; padding: 3px; margin: 3px;"> <{$commentsnav}> <{$lang_notice}> </div> <div style="margin: 3px; padding: 3px;"> <!-- start comments loop --> <{if $comment_mode == "flat"}> <{include file="db:system_comments_flat.html"}> <{elseif $comment_mode == "thread"}> <{include file="db:system_comments_thread.html"}> <{elseif $comment_mode == "nest"}> <{include file="db:system_comments_nest.html"}> <{/if}> <!-- end comments loop --> </div> <{/if}> You can obviously mess with the CSS and use whatever background image you want. 
|
| Re: Peekays Tab Hack for Content 0.5 |
| by Peekay on 2007/1/28 22:36:26 If you use Content 0.6, I have posted a small bug-fix connected with page titles in this post |
| Re: Peekays Tab Hack for Content 0.5 |
| by Peekay on 2007/1/28 19:04:31 Don't forget that in XOOPS you need to update the module after replacing a template file. Otherwise the original template will remain in the DB. |
| Re: Peekays Tab Hack for Content 0.5 |
| by domineaux on 2007/1/28 15:38:02 Quote:
I'm on the latest XOOPS 2.0.X. The module appears to be working, but I'm not having much luck with the tabbed content. I think I'll take this project on next week. Thanks for your response |
| Re: Peekays Tab Hack for Content 0.5 |
| by Peekay on 2007/1/28 13:02:04 Hi domineaux. There are a lot of postings in the Content module comments. (so many in fact it breaks the page). I think a lot are regarding the newer development where the dev is trying to incorporate a permissions system. Content 0.5 installs just fine for me and works right out of the box, but I am using XOOPS 2.0.13.2. It may not work at all with a later version of XOOPS or PHP 5 or MySQL 5. As far as the hack is concerned, simply replace 'index.php' and the template 'ct_index.html' as explained in my post #1. If you want to try tabbed blocks, use the procedure in post #3, but use the amended code from post #6 to create the PHP file. |
Search
Recent Posts
Who's Online
Donat-O-Meter
| Stats | |
| Goal: | $15.00 |
| Due Date: | Jul 31 |
| Gross Amount: | $0.00 |
| Net Balance: | $0.00 |
| Left to go: | $15.00 |
|
|