Jump to content


Photo

Custom MFL Tabs


This topic has been archived. This means that you cannot reply to this topic.
66 replies to this topic

#1 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 23 February 2017 - 01:04 PM

If you using a new skin , or even a custom skin ,  Habman and I created some tabs you can use that will take on the display of your existing site , no css coloring is needed.  Demo site here - http://www03.myfanta...2016/home/75656

 

 

Custom Tabs Generator to create the HTML - http://nitrografixx....MFL-CustomTabs/

 

See tabs for Standings / Owners Desk / Pools

 

 

First thing to do is load this script in a header message , no jquery library is needed for these tabs to function. We are mimicking the function and html of the new mfl default tabs. 

<script src="//www.nitrografixx.com/MFL-CustomTabs/customTabs.js"></script>

 

Now that you have the script loaded , your ready to create your new custom tabs. Open a homepage message and add the following HTML. You can change the modules , the caption header title and the name of the tabs.

 

 

TAB GROUP #1 - Owners Desk

<div id="myfantasyleague_tabs">
   <table class="report">
      <caption><span>Owners Desk</span></caption>
      <tbody></tbody>
   </table>
   <div class="toggle_tabs">
      <table class="report">
         <tbody>
            <tr>
               <td>
                  <div class="myfantasyleague_tabmenu">
                     <span id='tab_title_300'>300</span>
                     <input id="sub300" type="checkbox">
                     <label for="sub300"><span></span></label>
                     <ul id="homepagetabs">
                        <li id="tab300" onclick="javascript:show_custom_tab('300');"><a class="no-sub">Login<input id="sub300" type="checkbox"><label for="sub300"></label></a></li>
                        <li id="tab301" onclick="javascript:show_custom_tab('301');"><a class="no-sub">Scratchpad<input id="sub300" type="checkbox"><label for="sub300"></label></a></li>
                        <li id="tab302" onclick="javascript:show_custom_tab('302');"><a class="no-sub">Watch List<input id="sub300" type="checkbox"><label for="sub300"></label></a></li>
                        <li id="tab303" onclick="javascript:show_custom_tab('303');"><a class="no-sub">Trade Bait<input id="sub300" type="checkbox"><label for="sub300"></label></a></li>
                     </ul>
                  </div>
               </td>
            </tr>
         </tbody>
      </table>
      <div class="tabs_scroll">
         <div id="tabcontent300" class="homepagetabcontent">
            <module name="WELCOME" style="display:block"/>
         </div>
         <div id="tabcontent301" class="homepagetabcontent">
            <module name="MY_SCRATCHPAD"/>
         </div>
         <div id="tabcontent302" class="homepagetabcontent">
            <module name="MY_WATCH_LIST"/>
         </div>
         <div id="tabcontent303" class="homepagetabcontent">
            <module name="TRADE_BAIT"/>
         </div>
      </div>
   </div>
</div>
<script>
   show_custom_tab(300);
</script>

 

 

Add that homepage message to your site and it will look like the rest of your reports and tabs

 

Now if you want to add a 2nd set of tabs , you have to understand that you can't duplicate any of the numbers in your previous set (200) for example in the tab group above , so this next set we base everything off (300) or 400,500,600,700.... and so on. Make sure all digits are changed , example below of 2nd set.

 

 

TAB GROUP #2 - Standings

<div id="myfantasyleague_tabs">
   <table class="report">
      <caption><span>Standings</span></caption>
      <tbody></tbody>
   </table>
   <div class="toggle_tabs">
      <table class="report">
         <tbody>
            <tr>
               <td>
                  <div class="myfantasyleague_tabmenu">
                     <span id='tab_title_600'>600</span>
                     <input id="sub600" type="checkbox">
                     <label for="sub600"><span></span></label>
                     <ul id="homepagetabs">
                        <li id="tab600" onclick="javascript:show_custom_tab('600');"><a class="no-sub">Div 1<input id="sub600" type="checkbox"><label for="sub600"></label></a></li>
                        <li id="tab601" onclick="javascript:show_custom_tab('601');"><a class="no-sub">Div 2<input id="sub600" type="checkbox"><label for="sub600"></label></a></li>
                        <li id="tab602" onclick="javascript:show_custom_tab('602');"><a class="no-sub">Div 1<input id="sub600" type="checkbox"><label for="sub600"></label></a></li>
                        <li id="tab603" onclick="javascript:show_custom_tab('603');"><a class="no-sub">All Divisions<input id="sub600" type="checkbox"><label for="sub600"></label></a></li>
                     </ul>
                  </div>
               </td>
            </tr>
         </tbody>
      </table>
      <div class="tabs_scroll">
         <div id="tabcontent600" class="homepagetabcontent">
            <module name="STANDINGS" UNIT="DIVISION00"/>
         </div>
         <div id="tabcontent601" class="homepagetabcontent">
            <module name="STANDINGS" UNIT="DIVISION01"/>
         </div>
         <div id="tabcontent602" class="homepagetabcontent">
            <module name="STANDINGS" UNIT="DIVISION02"/>
         </div>
         <div id="tabcontent603" class="homepagetabcontent">
            <module name="STANDINGS"/>
         </div>
      </div>
   </div>
</div>
<script>
   show_custom_tab(600);
</script>

 

 

 

TAB GROUP #3 - Example for pools

<div id="myfantasyleague_tabs">
   <table class="report">
      <caption><span>Pools</span></caption>
      <tbody></tbody>
   </table>
   <div class="toggle_tabs">
      <table class="report">
         <tbody>
            <tr>
               <td>
                  <div class="myfantasyleague_tabmenu">
                     <span id='tab_title_400'>400</span>
                     <input id="sub400" type="checkbox">
                     <label for="sub400"><span></span></label>
                     <ul id="homepagetabs">
                        <li id="tab400" onclick="javascript:show_custom_tab('400');"><a class="no-sub">NFL Pool<input id="sub400" type="checkbox"><label for="sub400"></label></a></li>
                        <li id="tab401" onclick="javascript:show_custom_tab('401');"><a class="no-sub">Fantasy Pool<input id="sub400" type="checkbox"><label for="sub400"></label></a></li>
                        <li id="tab402" onclick="javascript:show_custom_tab('402');"><a class="no-sub">NFL Survivor<input id="sub400" type="checkbox"><label for="sub400"></label></a></li>
                     </ul>
                  </div>
               </td>
            </tr>
         </tbody>
      </table>
      <div class="tabs_scroll">
         <div id="tabcontent400" class="homepagetabcontent">
            <module name="NFL_CONFIDENCE_POOL"/>
         </div>
         <div id="tabcontent401" class="homepagetabcontent">
            <module name="FANTASY_CONFIDENCE_POOL"/>
         </div>
         <div id="tabcontent402" class="homepagetabcontent">
            <module name="NFL_SURVIVOR_POOL"/>
         </div>
      </div>
   </div>
</div>
<script>
   show_custom_tab(400);
</script>

 

 

TAB GROUP #4 - Example 12 team rosters

<div id="myfantasyleague_tabs">
   <table class="report">
      <caption><span>Rosters</span></caption>
      <tbody></tbody>
   </table>
   <div class="toggle_tabs">
      <table class="report">
         <tbody>
            <tr>
               <td>
                  <div class="myfantasyleague_tabmenu">
                     <span id='tab_title_500'>500</span>
                     <input id="sub500" type="checkbox">
                     <label for="sub500"><span></span></label>
                     <ul id="homepagetabs">
                        <li id="tab500" onclick="javascript:show_custom_tab('500');"><a class="no-sub">Fran1<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab501" onclick="javascript:show_custom_tab('501');"><a class="no-sub">Fran2<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab502" onclick="javascript:show_custom_tab('502');"><a class="no-sub">Fran3<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab503" onclick="javascript:show_custom_tab('503');"><a class="no-sub">Fran4<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab504" onclick="javascript:show_custom_tab('504');"><a class="no-sub">Fran5<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab505" onclick="javascript:show_custom_tab('505');"><a class="no-sub">Fran6<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab506" onclick="javascript:show_custom_tab('506');"><a class="no-sub">Fran7<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab507" onclick="javascript:show_custom_tab('507');"><a class="no-sub">Fran8<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab508" onclick="javascript:show_custom_tab('508');"><a class="no-sub">Fran9<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab509" onclick="javascript:show_custom_tab('509');"><a class="no-sub">Fran10<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab510" onclick="javascript:show_custom_tab('510');"><a class="no-sub">Fran11<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                        <li id="tab511" onclick="javascript:show_custom_tab('511');"><a class="no-sub">Fran12<input id="sub500" type="checkbox"><label for="sub500"></label></a></li>
                     </ul>
                  </div>
               </td>
            </tr>
         </tbody>
      </table>
      <div class="tabs_scroll">
         <div id="tabcontent500" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0001"/>
         </div>
         <div id="tabcontent501" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0002"/>
         </div>
         <div id="tabcontent502" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0003"/>
         </div>
         <div id="tabcontent503" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0004"/>
         </div>
         <div id="tabcontent504" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0005"/>
         </div>
         <div id="tabcontent505" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0006"/>
         </div>
         <div id="tabcontent506" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0007"/>
         </div>
         <div id="tabcontent507" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0008"/>
         </div>
         <div id="tabcontent508" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0009"/>
         </div>
         <div id="tabcontent509" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0010"/>
         </div>
         <div id="tabcontent510" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0011"/>
         </div>
         <div id="tabcontent511" class="homepagetabcontent">
            <module name="ROSTER" FRANCHISE="0012"/>
         </div>
      </div>
   </div>
</div>
<script>
   show_custom_tab(500);
</script>

All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!


#2 lurkmaster

lurkmaster

    Veteran

  • Members
  • PipPipPip
  • 106 posts

Posted 24 February 2017 - 06:29 AM

Nicely done!



#3 StevenB14

StevenB14

    Veteran

  • Members
  • PipPipPip
  • 69 posts

Posted 24 February 2017 - 07:58 AM

This is great.  I think I'll be overhauling my current set up with these.



#4 bonscott

bonscott

    Veteran

  • Members
  • PipPipPip
  • 7,882 posts

Posted 24 February 2017 - 08:04 AM

Thanks much, will replace my current tab code with this.



 


#5 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 24 February 2017 - 08:10 AM

on mobile , if your using a new skin , you'll notice the tab header changes the display name depending on which tab is active

 

i am submitting this same change to MFL so they can update the mflcommon.js file so the default tabs do the same thing instead of always displaying "League Tabs" - use the current tab text instead


All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!


#6 DA-G-GURU

DA-G-GURU

    Veteran

  • Members
  • PipPipPip
  • 1,196 posts

Posted 24 February 2017 - 09:06 AM

Very cool all the way around!
Simply The Best in Grafix and CSS webdesign since 2005

www.dagrafixdesigns.com

---------------
Twitter @DA_Sticks

#7 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 24 February 2017 - 09:37 AM

I'm going to push to see if MFL can offer up some new modules that are grouped into tabs , Reports , Owners Desk , Pools 

 

if they can add a module that will create a group of tabs , all the skins already have the css to style them the same as the tab menu 

 

If anyone can list some ideas for a group of tabs and the modules that should reside in them , i will pitch the idea to them , it should be fairly easy for them to generate this.

 

This way the average Joe user , has the option to import a homepage module that has some grouped items not taking up his entire page

 

 

Tab Group Name :  Top Players

Modules: 

<module name="TOP_PERFORMERS" COUNT="10" POSITION="QB" />

<module name="TOP_PERFORMERS" COUNT="10" POSITION="RB" />

<module name="TOP_PERFORMERS" COUNT="10" POSITION="WR" />

<module name="TOP_PERFORMERS" COUNT="10" POSITION="TE" />

<module name="TOP_PERFORMERS" COUNT="10" POSITION="PK" />

<module name="TOP_PERFORMERS" COUNT="10" POSITION="DEF" />   - make this dynamic to add top safties, line backers , d-lineman if IDP league

 

Tab Group Name: Top Free Agents

Modules:

<module name="TOP_FA" COUNT="10" POSITION="QB" />

<module name="TOP_FA" COUNT="10" POSITION="RB" />

<module name="TOP_FA" COUNT="10" POSITION="WR" />

<module name="TOP_FA" COUNT="10" POSITION="TE" />

<module name="TOP_FA" COUNT="10" POSITION="PK" />

<module name="TOP_FA" COUNT="10" POSITION="DEF" />   - make this dynamic to add top safties, line backers , d-lineman if IDP league

 

Tab Group Name: Top Add/Drops

Modules:

<module name="TOP_ADDS" COUNT="15"/>
<module name="TOP_DROPS" COUNT="15"/>
<module name="TOP_STARTERS" COUNT="15"/>
<module name="TOP_OWNS" COUNT="15"/>
<module name="TOP_STEALS" COUNT="15"/>
<module name="TOP_BUSTS" COUNT="15"/>
 

Tab Group Name: League Pools

Modules:

<module name="FANTASY_CONFIDENCE_POOL"/>
<module name="NFL_SURVIVOR_POOL"/>
<module name="NFL_CONFIDENCE_POOL"/>
<module name="TOP_SURVIVOR_PICKS"/>
 

Tab Group Name: League Reports

Modules:

<module name="TRANSACTIONS"/>
<module name="NFLSCHEDULE"/>
<module name="POWER_RANK"/>
<module name="WEEKLY_SUMMARY"/>
<module name="NEXT_WEEKS_FANTASY_SCHEDULE"/>
<module name="LAST_WEEKS_FANTASY_RESULTS"/>

 

Tab Group Name: Owners Desk

Modules:

<module name="LEAGUE_CHAT"/>
<module name="TWITTER_FEED"/>
<module name="OWNER_ACTIVITY"/>
<module name="MY_OPTIONS"/>
<module name="MY_SCRATCHPAD"/>

All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!


#8 StevenB14

StevenB14

    Veteran

  • Members
  • PipPipPip
  • 69 posts

Posted 24 February 2017 - 10:34 AM

I'm intending on spending some time tonight in creating groups for my site.  I'll post some suggestions for discussion.

 

Is this still the most up to date list of modules?

http://forums.myfant...c=21522&&page=7



#9 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 24 February 2017 - 10:58 AM

I'm intending on spending some time tonight in creating groups for my site.  I'll post some suggestions for discussion.

 

Is this still the most up to date list of modules?

http://forums.myfant...c=21522&&page=7

 

 

you can look up any module by going to the main menu bar , hover over Reports > League and clicking on MFL Widgets 


All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!


#10 NateDawg

NateDawg

    Veteran

  • Members
  • PipPipPip
  • 57 posts

Posted 24 February 2017 - 11:32 AM

Here's how I organize my homepage tabs and it has worked well for me. I only play in Dynasty leagues.

 

Tab: Auction/Waivers

Modules: My Watch List, Current Auctions, Blind Bidding Summary, Top 10 Free Agents, Player Search, My Scratchpad, Top 10 Added Players, Top 10 Dropped Players

 

Tab: My Team

Modules: Franchise Roster, My Options, Starter Points by Position, My 5 Newest News Articles, Who Should I Start?, Submit Lineup

 

Tab: Draft

Modules: Draft Status, My Draft Picks, Recent Draft Picks, My Draft List

 

Tab: Gameday

Modules: Brief League Standings Report, Franchise Schedule, Next Week's Fantasy Schedule, Live Scoring Summary, Monday Night Report, Next Week's NFL Schedule

 

Tab: Around the League

Modules: Trade Bait, Power Rank Report, Today's League News, Hot Player News



#11 bonscott

bonscott

    Veteran

  • Members
  • PipPipPip
  • 7,882 posts

Posted 24 February 2017 - 12:06 PM

I have several "sub-tab" modules like this on my sites.  Here are my groupings I've been using for a few years.  I think I've updated the tab code 2 or 3 times as you guys come up with new versions.   :)  I may re-org things a bit with the new site but this has worked for me for years, no sense changing what ain't broke.

 

I have the following main MFL tabs:  

Main (Chat, League Article, Activity, Pools, Message board link)

Gameday (Habman scoreboard link, live scoring, brief standings, previews, recaps, MNF, schedules)

GM Office (Everything for My team)

Pools & Points (all pools and weekly summary)

Scouting Dept (Player news, player search, top players)

Trades & Waivers (Waiver order or Blind Bidding summary, Trade link, trade bait)

Playoffs (Habman's what if playoff module, Playoff brackets)

History (Champion Plaque, custom league history stuff)

 

Sub-Tabs I would use the code in this thread for:

Schedules - Results, Fantasy Schedule, NFL Schedule

Recaps - Fantasy Preview, Fantasy Reviews, Monday Night report

My Team - My Roster, Watchlist, My News, My On Bye players, My Schedule, My Draft Picks, Results Chart, My Trophy Case)

Pools & Points - Weekly Summary, NFL Pool, Fantasy Pool, Survivor Pool

Player News - My News, All News, Hot News

Top Players - Top 25 of each position including IDP, Top 25 MVP

 

As I just went thru this I see several homepage modules are not showing up anymore.  Possible some have had their names changed?  I'll find out when I go thru it all in a few weeks.



 


#12 DA-G-GURU

DA-G-GURU

    Veteran

  • Members
  • PipPipPip
  • 1,196 posts

Posted 24 February 2017 - 12:49 PM

Bonscott....do you have that MFL message on your page about the auctions?? If so that is likely causing this issue....i have same on some sites...
 
MFL states they are close to being done......who knows

You can also log out of MFL and view your site.....if you see the modules once logged out...I say that is the reason for sure.
Simply The Best in Grafix and CSS webdesign since 2005

www.dagrafixdesigns.com

---------------
Twitter @DA_Sticks

#13 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 24 February 2017 - 02:00 PM

Habman will be releasing a new Player News here in a few days 

 

its much improved and there are a few key notes which will come

 

If you using any MFL skin , you won't need ANY css at all for it to match your site , if your using a custom designed skin , you'll only need 6 lines of css coloring to match your site , it will take in colors from your reports for 95% of the design.

 

I'm adding the base css to the MFLBaseCSS.css file which will load for every MFL site , as we anticipate at some point for MFL to provide this script this on their end of things , but for now , we can have it up and running on our sites by loading the script in a header message.

 

So all 40+ skins will already have the matching css provided within the skin base css files 


All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!


#14 quickolas1

quickolas1

    Veteran

  • Members
  • PipPipPip
  • 959 posts

Posted 24 February 2017 - 03:24 PM

Starter Points by Position

 

I would scrap any of these fusion chart modules. There are a couple of them: bar or line chart graphs.

Practically useless and they slow down loading time when paired with custom content & scripts (like this one for tabbing).

 

Who Should I Start?

 

Worst. Module. Ever.

 

P.S. Give Warren G my fondest regards.



#15 theeohiostate

theeohiostate

    Veteran

  • Members
  • PipPipPip
  • 3,926 posts

Posted 24 February 2017 - 04:11 PM

I think they will be scrapping some modules

All the scripts I post were created by Habman , with some small contributions from myself. The man has done an outstanding job giving the community a variety of options to enhance the site. Thank you sir !!