תבנית:לשוניות: הבדלים בין גרסאות בדף

גרסה אחרונה מ־05:36, 13 בספטמבר 2020

התבנית יוצרת טבלה עם טאבים (לשוניות), תוך שימוש ב-JavaScript (מדיה ויקי:Tabs.js). תבנית זו לא עובדת אצל משתמשים שלא מופעל אצלם JavaScript (לכן יש להגדיר תוכן חלופי) ותבניות מוסתרות שנמצאות בלשוניות (כמו תבניות ניווט) לא עובדות בה - מסיבה זו יש להעדיף בדרך כלל את תבנית:לשוניות2.

{{לשוניות
| זיהוי = 
| תוכן חלופי = 
| שם1 = 
| תוכן1 = 
| שם2 = 
| תוכן2 = 
| שם3 = 
| תוכן3 = 
| שם4 = 
| תוכן4 = 
| שם5 = 
| תוכן5 = 
| שם6 = 
| תוכן6 = 
| שם7 = 
| תוכן7 = 
| שם8 = 
| תוכן8 = 
| שם9 = 
| תוכן9 = 
| שם10 = 
| תוכן10 = 
| ברירת מחדל = 
| רוחב = 
| גבול = 
| רקע = 
| יישור = 
}}

זיהוי - יש להזין בפרמטר זיהוי מספר ייחודי בין 1 ל-10, למטרות זיהוי כאשר יש יותר מתבנית טאבים אחת בדף. פרמטר זה הוא פרמטר חובה, גם אם יש רק תבנית אחת בדף.
שםX - כאשר X הוא מספר מ-1 עד 10, הוא כותרת הטאב X. לא ניתן להשתמש במירכאות ( " ) בשם הטאב כיוון שזהו סימן מיוחד ב HTML, ולכן כדי להציג מירכאות יש להחליפן בביטוי: " בכל מקום בו הן מופיעות.
תוכןX - כאשר X הוא מספר מ-1 עד 10, הוא תוכן הטאב X.
ברירת מחדל - מספר הטאב שצריך להיות מוצג בברירת מחדל. אם פרמטר זה לא הוגדר, יוגדר הטאב הראשון כברירת מחדל.
תוכן חלופי - שם של דף שבו יופיע תוכן כל הטאבים אחד אחרי השני בצורה גולמית (עבור דפדפנים שה-JS בהם אינו פעיל).
יישור - יישור הטבלה לאחד הצדדים left או right או center. אם פרמטר זה לא הוגדר, יוגדר היישור לאמצע כברירת מחדל.
רוחב - רוחב הטבלה, באחוזים (%) או פיקסלים (px). אם פרמטר זה לא הוגדר, יוגדר הרוחב ל-90% כברירת מחדל.
גבול - צבע הגבול. אם פרמטר זה לא הוגדר, יוגדר הצבע #45A22F ( ) כברירת מחדל.
רקע - צבע הרקע. אם פרמטר זה לא הוגדר, יוגדר הצבע #DEFED6 ( ) כברירת מחדל.

תוכן עניינים[עריכת קוד מקור]

אם התוכן של הלשוניות כולל סעיפים, עלולה להיווצר בעיה עם תוכן העניינים: בדרך כלל התוכן יוצג מחוץ ללשוניות או בלשונית הראשונה, כאשר הוא כולל הן את הסעיפים בדף שמחוץ ללשוניות, והן את כל הסעיפים של כל דפי התוכן שמוכללים דרך הלשוניות. כתוצאה מכך, הקישורים לסעיפים שנמצאים בלשוניות שאינן פתוחות ברגע מסוים לא יפעלו כמצופה. דרך להתגבר על כך היא להשתמש במילת הקסם ___ללא_תוכן_עניינים___, וליצור בעמוד שמכיל את הלשונית ובמידת הצורך בלשוניות עצמן (כלומר בדפי התוכן המתאימים) תוכן עניינים בצורה ידנית, כמו שמוסבר בחב"דפדיה:תוכן עניינים ידני.

אין תיאור.

[עריכת נתוני תבנית]
פרמטרים של תבניות
פרמטר		תיאור	סוג	מצב
זיהוי	`זיהוי`	אין תיאור	בלתי־ידוע	לא חובה
תוכן חלופי	`תוכן חלופי`	אין תיאור	בלתי־ידוע	לא חובה
שם1	`שם1`	אין תיאור	בלתי־ידוע	לא חובה
תוכן1	`תוכן1`	אין תיאור	בלתי־ידוע	לא חובה
שם2	`שם2`	אין תיאור	בלתי־ידוע	לא חובה
תוכן2	`תוכן2`	אין תיאור	בלתי־ידוע	לא חובה
שם3	`שם3`	אין תיאור	בלתי־ידוע	לא חובה
תוכן3	`תוכן3`	אין תיאור	בלתי־ידוע	לא חובה
שם4	`שם4`	אין תיאור	בלתי־ידוע	לא חובה
תוכן4	`תוכן4`	אין תיאור	בלתי־ידוע	לא חובה
שם5	`שם5`	אין תיאור	בלתי־ידוע	לא חובה
תוכן5	`תוכן5`	אין תיאור	בלתי־ידוע	לא חובה
שם6	`שם6`	אין תיאור	בלתי־ידוע	לא חובה
תוכן6	`תוכן6`	אין תיאור	בלתי־ידוע	לא חובה
שם7	`שם7`	אין תיאור	בלתי־ידוע	לא חובה
תוכן7	`תוכן7`	אין תיאור	בלתי־ידוע	לא חובה
שם8	`שם8`	אין תיאור	בלתי־ידוע	לא חובה
תוכן8	`תוכן8`	אין תיאור	בלתי־ידוע	לא חובה
שם9	`שם9`	אין תיאור	בלתי־ידוע	לא חובה
תוכן9	`תוכן9`	אין תיאור	בלתי־ידוע	לא חובה
שם10	`שם10`	אין תיאור	בלתי־ידוע	לא חובה
תוכן10	`תוכן10`	אין תיאור	בלתי־ידוע	לא חובה
ברירת מחדל	`ברירת מחדל`	אין תיאור	בלתי־ידוע	לא חובה
רוחב	`רוחב`	אין תיאור	בלתי־ידוע	לא חובה
גבול	`גבול`	אין תיאור	בלתי־ידוע	לא חובה
רקע	`רקע`	אין תיאור	בלתי־ידוע	לא חובה
יישור	`יישור`	אין תיאור	בלתי־ידוע	לא חובה

@@ שורה 1: / שורה 1: @@
-<includeonly><html><div class="tab">
+<noinclude>{{ניהול פרמטרים/תוכן}}</noinclude><includeonly>{{#invoke:ParamValidator|validateparams|module_options=יחידה:PV-options}}</includeonly><includeonly>{{טען סקריפט|gadgetname=Tabs}}<div id="custom{{{זיהוי|}}}TabsWait" style="font-size: small; color: green;" class="loadingTabsTemplate">טוען את הלשוניות... {{#תנאי:{{{תוכן חלופי|}}}|<small>(אם הדף אינו נטען במלואו כעבור מספר שניות, באפשרותכם לראות את הטקסט המלא בדף [[{{{תוכן חלופי}}}|זה]])</small>}}</div><div id="custom{{{זיהוי|}}}Tabs" class="tabsTemplate">{{#תנאי:{{{שם1|}}}|<div id="custom{{{זיהוי|}}}Tab1" title="{{{שם1}}}">
- <button id="LondonButton" class="tablinks" onclick="openCity(event, 'London')">{{{שם1}}}</button>
+{{{תוכן1|}}}</div>}}{{#תנאי:{{{שם2|}}}|<div id="custom{{{זיהוי|}}}Tab2" title="{{קידוד | {{{שם2}}} }}">
- <button id="ParisButton" class="tablinks" onclick="openCity(event, 'Paris')">{{{שם2}}}</button>
+{{{תוכן2|}}}</div>}}{{#תנאי:{{{שם3|}}}|<div id="custom{{{זיהוי|}}}Tab3" title="{{קידוד | {{{שם3}}} }}">
- <button id="TokyoButton" class="tablinks" onclick="openCity(event, 'Tokyo')">{{{שם3}}}</button>
+{{{תוכן3|}}}</div>}}{{#תנאי:{{{שם4|}}}|<div id="custom{{{זיהוי|}}}Tab4" title="{{קידוד | {{{שם4}}} }}">
-</div>
+{{{תוכן4|}}}</div>}}{{#תנאי:{{{שם5|}}}|<div id="custom{{{זיהוי|}}}Tab5" title="{{קידוד |  {{{שם5}}} }}">
-</html>
+{{{תוכן5|}}}</div>}}{{#תנאי:{{{שם6|}}}|<div id="custom{{{זיהוי|}}}Tab6" title="{{קידוד | {{{שם6}}} }}">
-<div id="London" class="tabcontent">
+{{{תוכן6|}}}</div>}}{{#תנאי:{{{שם7|}}}|<div id="custom{{{זיהוי|}}}Tab7" title="{{קידוד | {{{שם7}}} }}">
- <h3 id="LondonTabHeadText" style="display:none">{{{שם1}}}</h3>
+{{{תוכן7|}}}</div>}}{{#תנאי:{{{שם8|}}}|<div id="custom{{{זיהוי|}}}Tab8" title="{{קידוד | {{{שם8}}} }}">
- <p>{{{תוכן1}}}</p>
+{{{תוכן8|}}}</div>}}{{#תנאי:{{{שם9|}}}|<div id="custom{{{זיהוי|}}}Tab9" title="{{קידוד | {{{שם9}}} }}">
-</div>
+{{{תוכן9|}}}</div>}}{{#תנאי:{{{שם10|}}}|<div id="custom{{{זיהוי|}}}Tab10" title="{{קידוד | {{{שם10}}} }}">
+{{{תוכן10|}}}</div>}}{{#תנאי:{{{ברירת מחדל|}}}|<div id="custom{{{זיהוי|}}}TabDefault">{{{ברירת מחדל}}}</div>}}{{#תנאי:{{{רוחב|}}}|<div id="custom{{{זיהוי|}}}TabWidth">{{{רוחב}}}</div>}}{{#תנאי:{{{גבול|}}}|<div id="custom{{{זיהוי|}}}TabBorder">{{{גבול}}}</div>}}{{#תנאי:{{{רקע|}}}|<div id="custom{{{זיהוי|}}}TabBackground">{{{רקע}}}</div>}}{{#תנאי:{{{יישור|}}}|<div id="custom{{{זיהוי|}}}TabAlign">{{{יישור}}}</div>}}</div></includeonly><noinclude>
-<div id="Paris" class="tabcontent">
+{{/תיעוד}}
- <h3 id="ParisTabHeadText" style="display:none">{{{שם2}}}</h3>
- <p>{{{תוכן2}}}</p>
-</div>
-<div id="Tokyo" class="tabcontent">
+<templatedata>
- <h3 id="TokyoTabHeadText" style="display:none">{{{שם3}}}</h3>
+{
- <p>{{{תוכן3}}}</p>
+	"params": {
-</div>
+		"זיהוי": {},
-<html>
+		"תוכן חלופי": {},
-<style>
+		"שם1": {},
-/* Style the tab */
+		"תוכן1": {},
-div.tab {
+		"שם2": {},
-  overflow: hidden;
+		"תוכן2": {},
-  border: 1px solid #ccc;
+		"שם3": {},
-  background-color: #f1f1f1;
+		"תוכן3": {},
+		"שם4": {},
+		"תוכן4": {},
+		"שם5": {},
+		"תוכן5": {},
+		"שם6": {},
+		"תוכן6": {},
+		"שם7": {},
+		"תוכן7": {},
+		"שם8": {},
+		"תוכן8": {},
+		"שם9": {},
+		"תוכן9": {},
+		"שם10": {},
+		"תוכן10": {},
+		"ברירת מחדל": {},
+		"רוחב": {},
+		"גבול": {},
+		"רקע": {},
+		"יישור": {}
+	}
 }
+</templatedata>
-/* Style the buttons inside the tab */
+</noinclude>
-div.tab button {
-  background-color: inherit;
-  float: right;
-  border: none;
-  outline: none;
-  cursor: pointer;
-  padding: 14px 16px;
-  transition: 0.3s;
-}
-/* Change background color of buttons on hover */
-div.tab button:hover {
-  background-color: #ddd;
-}
-/* Create an active/current tablink class */
-div.tab button.active {
-  background-color: #ccc;
-}
-/* Style the tab content */
-.tabcontent {
-  display: none;
-  padding: 6px 12px;
-  border: 1px solid #ccc;
-  border-top: none;
-}
-</style>
-<script>
-document.getElementById("LondonButton").textContent=document.getElementById("LondonTabHeadText").textContent;
-document.getElementById("ParisButton").textContent=document.getElementById("ParisTabHeadText").textContent;
-document.getElementById("TokyoButton").textContent=document.getElementById("TokyoTabHeadText").textContent;
-function openCity(evt, cityName) {
-  // Declare all variables
-  var i, tabcontent, tablinks;
-  // Get all elements with class="tabcontent" and hide them
-  tabcontent = document.getElementsByClassName("tabcontent");
-  for (i = 0; i < tabcontent.length; i++) {
-    tabcontent[i].style.display = "none";
-  }
-  // Get all elements with class="tablinks" and remove the class "active"
-  tablinks = document.getElementsByClassName("tablinks");
-  for (i = 0; i < tablinks.length; i++) {
-    tablinks[i].className = tablinks[i].className.replace(" active", "");
-  }
-  // Show the current tab, and add an "active" class to the button that opened the tab
-  document.getElementById(cityName).style.display = "block";
-  evt.currentTarget.className += " active";
-}
-</script>
-</html>
-</includeonly>
-<noinclude>
-==אופן השימוש==
-===פרמטרים===
-'''שםX''' - כתורת הלשונית X.{{ש}}
-'''תוכןX''' - תוכן הלשונית X.{{ש}}
-'''X הוא מספר הלשונית. (ניתן עד 3 לשוניות)'''{{ש}}
-=== דוגמא ===
-קוד:{{ש}}
-<nowiki>
-{{לשוניות
-|שם1=שם הלשונית הראשונה|תוכן1=התוכן שלה
-|שם2=שם|תוכן2=תוכן
-|שם3=שם|תוכן3=תוכן
-}}
-</nowiki>{{ש}}
-הקוד הזה יכתוב:
-{{לשוניות
-|שם1=שם הלשונית הראשונה|תוכן1=התוכן שלה
-|שם2=שם|תוכן2=תוכן
-|שם3=שם|תוכן3=תוכן
-}}
-התבנית תומכת בשלושה טאבים.

תבנית:לשוניות: הבדלים בין גרסאות בדף

גרסה אחרונה מ־05:36, 13 בספטמבר 2020

תוכן עניינים[עריכת קוד מקור]

תפריט ניווט