Widget:Timeline: Difference between revisions

From Madness Combat Wiki
VisualWikitext
No edit summary
No edit summary
 
(11 intermediate revisions by the same user not shown)
Line 1: Line 1:
<noinclude>
To insert this widget, use the following code:


<syntaxhighlight lang=moin>{{#widget:Timeline|id=1xuY4upIooEeszZ_lCmeNx24eSFWe0rHe9ZdqH2xqVNk}}</syntaxhighlight>
        <script type="text/javascript">
            var additionalOptions = {
                font: 'opensans-gentiumbook'
            }


== Parameters ==
            timeline = new TL.Timeline('timeline-embed',
* '''id''' - timeline id (everything after "''source=''")
            'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
* '''height''' timeline height, default = 650 (px)
            additionalOptions);
* '''width''' timeline width, 100% is default, can be % or pixels (without %)
        </script>
* '''zoom''' zoom ("initial zoom") in the timeline embed code


This widget lets you add a [https://timeline.knightlab.com/ Timeline] to your wiki page.
        <!-- or, if you have created your own CSS file... -->
        <script type="text/javascript">
            var additionalOptions = {
                font: '/css/my-custom-timeline-fonts.css'
            }


== Using this widget ==
            timeline = new TL.Timeline('timeline-embed',
For information on how to use this widget, see the [http://www.mediawikiwidgets.org/Timeline widget description page on MediaWikiWidgets.org].
            'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
<link rel="stylesheet" type="https://cdn.knightlab.com/libs/timeline3/latest/css/themes/timeline.theme.dark.css">
            additionalOptions);
== Copy to your site ==
        </script>
To use this widget on your site, install the [http://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki, as an article called '''{{FULLPAGENAME}}'''.
 
</noinclude><includeonly><iframe style="border: none;" width="<!--{$width|escape:'html'|default:'100%'}-->"height="<!--{$height|escape:'html'|default:650}-->" src="https://cdn.knightlab.com/libs/timeline3/latest/embed/index.html?source=<!--{$id|escape:'urlpathinfo'}-->&initial_zoom=<!--{$zoom|escape:'html'|default:2}-->&height=<!--{$height|escape:'html'|default:500}-->"></iframe></includeonly>
        <!-- another way, if you have created your own CSS file... -->
        <link rel="stylesheet" href="https://cdn.knightlab.com/libs/timeline3/latest/css/themes/timeline.theme.dark.css">
        <script type="text/javascript">
            var additionalOptions = {
                font: null
            }
 
            timeline = new TL.Timeline('timeline-embed',
            'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
            additionalOptions);
        </script>

Latest revision as of 09:47, 26 September 2024

       <script type="text/javascript">
           var additionalOptions = {
               font: 'opensans-gentiumbook'
           }

           timeline = new TL.Timeline('timeline-embed',
           'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
           additionalOptions);
       </script>

       <script type="text/javascript">
           var additionalOptions = {
               font: '/css/my-custom-timeline-fonts.css'
           }

           timeline = new TL.Timeline('timeline-embed',
           'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
           additionalOptions);
       </script>

       <link rel="stylesheet" href="https://cdn.knightlab.com/libs/timeline3/latest/css/themes/timeline.theme.dark.css">
       <script type="text/javascript">
           var additionalOptions = {
               font: null
           }

           timeline = new TL.Timeline('timeline-embed',
           'https://docs.google.com/spreadsheets/d/e/2PACX-1vShzlBjUVf_4TiOCanqjS3W6nd9r8uwwwv4mkQ6fWZptVYrsDVa4XtwGbSVJQ9kQf8zbWkRVyt2suPS/pubhtml',
           additionalOptions);
       </script>
Retrieved from "https://madnesscombat.wiki/index.php?title=Widget:Timeline&oldid=2589"