தளவமைப்புகளுக்கான விட்ஜெட் குறிச்சொற்கள்

குறியீட்டின் பிரிவை வெவ்வேறு இடங்களில் மீண்டும் பயன்படுத்த விரும்பினாலோ குறிப்பிட்ட சூழ்நிலைகளில் மட்டும் சேர்க்க விரும்பினாலோ அவ்வாறு செய்வதற்கு Includes மிகவும் பயன்படும்.

இதைச் செய்ய, b:includable குறியீட்டிற்குள் உள்ளடக்கத்தை எழுதி அது தோன்ற வேண்டுமென விரும்பும் இடங்களில் b:include குறியீட்டைப் பயன்படுத்தவும்.

<b:includable id='main' var='thiswidget'>
  [insert whatever content you want here]
</b:includable>

b:include குறிச்சொல்லுக்கான பண்புக்கூறுகள் பின்வருமாறு:

• பெயர் (அவசியம்): எழுத்துகளையும் எண்களையும் கொண்ட அடையாளங்காட்டி. அதே விட்ஜெட்டில் ஏற்கெனவே உள்ள b:includableளின் ஐடியுடன் இது பொருந்த வேண்டும்.
• தரவு (விரும்பினால்): Includable பிரிவிற்கு அனுப்பும் கோவை/தரவின் பகுதி. இது அந்த Includableளில் மாறியின் பண்புக்கூறின் மதிப்பாக மாறும்.
• நிபந்தனை (விரும்பினால்) இதன் முடிவு True ஆக இருக்கும்போது மட்டுமே Includeடைச் செயல்படுத்தும் கோவை. இதுவும் b:if என்பதிலுள்ள நிபந்தனைப் பண்புக்கூறும் ஒன்றாகும்.

b:includable, b:include ஆகியவற்றை எப்படிப் பயன்படுத்துவது என்பதைக் காண்பிக்கும் எடுத்துக்காட்டு இங்குள்ளது.

"இடுகைப்" பிரிவு எப்படிப் "பிரதான" பிரிவில் அடங்குகிறது என்பதுதான் இங்கே புரிந்துகொள்ள வேண்டிய முக்கிய விஷயம். "p" என அழைக்கின்ற இடுகையைக் கடந்துசெல்லும். மேலும் Included பிரிவு இதை அதன் மாறி "post" என்பதாக மேற்கோளிட்டு, பிறகு தலைப்பை அச்சிடும்.

கவனத்திற்கு: 10க்கும் குறைவான பொருளடக்கம் இருக்கும்போது மட்டுமே Include இயங்குகிறது. எனவே இந்த எடுத்துக்காட்டில் அதிகபட்சம் 10 இடுகைகள் மட்டுமே ரென்டரிங் செய்யப்படும் (பொருளடக்கம் 0 இல் தொடங்குகிறது).

 

<b:includable id='main'>
  <b:loop var='p' index='index' values='posts'>
    <b:include name='post' data='p' cond='index < 10'/>
  </b:loop>
</b:includable>
<b:includable id='post' var='post'>
  Title: <data:post.title/>
</b:includable>

லூப்களைப் பயன்படுத்துவதற்கான பொதுவான வடிவமைப்பு இது:

 

<b:loop var='identifier' values='set-of-data'>
  [repeated content goes here]
</b:loop>

 

'அடையாளங்காட்டி' (i) எனும் பகுதி நீங்கள் தேர்வுசெய்யும் எந்தவொரு பெயராகவும் இருக்கலாம். லூப் வழியாகச் செல்லும் ஒவ்வொரு முறையும் பட்டியலிலுள்ள ஒவ்வொரு புதிய ஆவணத்திற்குமான மாற்றாக இது பயன்படுத்தப்படும். மதிப்புகளுக்காக நீங்கள் குறிப்பிடும் தரவுத் தொகுப்பு ஆனது ஆவணங்களின் பட்டியலாகத் தரவுக் குறிச்சொற்கள் கட்டுரையில் விவரிக்கப்பட்டுள்ள எந்தவொரு தரவுப் பகுதியாகவும் இருக்கலாம்.

உதாரணமாக வலைப்பதிவு இடுகைகள் விட்ஜெட்டில் posts ஒரு பட்டியல் ஆகும். பின்வருவது போன்ற குறியீடு ஒவ்வொரு இடுகையிலும் லூப் செய்யப்படும் மேலும் ஒவ்வொன்றிற்குமான தலைப்பை அது சம்பந்தமான மேற்குறிப்புக் குறிச்சொற்களுடன் அச்சிடும்.

 

<b:loop var='i' values='data:posts'>
  <h2><data:i.title/></h2>
</b:loop>

 

அடுத்தடுத்து ஒவ்வொரு இடுகையின் மதிப்பையும் "i" எப்படிக் கையாளுகிறது என்பதைக் கவனிக்கவும். இதனால் ஒவ்வொன்றிலிருந்தும் நீங்கள் தலைப்பைப் பெறலாம்.

‘1 முதல் 3', ‘-3 முதல் -9', போன்ற அந்த எண்களும் உள்ளடங்கும் எண் வரம்பு முழுவதும் திரும்பச் செய்ய லூப் குறிச்சொல் உங்களை அனுமதிக்கும், இதில் எண்ணின் மதிப்பை மாறியின் மதிப்பு எடுத்துக்கொள்ளும். பின்வரும் உதாரணம் 1, 2, 3 ஆகியவற்றின் வரிசையற்ற பட்டியலை உருவாக்கும்.

 

<b:loop var='i' values='1 to 3'>
  <li><data:i /></li>
</b:loop>

லூப் குறிச்சொற்களில் விருப்பத்தேர்வுக்குரிய பொருளடக்கப் பண்புக்கூறும் உள்ளது. இது லூப் வழியாக நடப்பு மறுநிகழ்வின் பூஜ்ஜியம் சார்ந்த பொருளடக்கத்தை வழங்கும்.

 

<ul>
  <b:loop var='number' index='index' values='9 to 7'>
    <li>Index: <data:index />, எண்: <data:number /></li>
  </b:loop>
</ul>

 

இந்த உதாரணம் இவற்றின் வரிசையற்ற பட்டியலை உருவாக்கும்:

• பொருளடக்கம்: 0, எண்: 9
• பொருளடக்கம்: 1, எண்: 8
• பொருளடக்கம்: 2, எண்: 7

<b:if cond='condition'>
  [content to display if condition is true]
<b:elseif cond='another condition'/>
  [முந்தைய if அல்லது elseif நிபந்தனைகள் எதுவும் True என இல்லாமல் இந்த elseif நிபந்தனை True என இருந்தால் காட்டப்பட வேண்டிய உள்ளடக்கம்]
<b:else/>
  [content to display if no if or elseif conditions are met]
</b:if>

"நிபந்தனைக்கு" True/False என மதிப்பிடும் எதையும் சேர்க்கலாம். சில தரவுக் குறிச்சொற்கள் தாமாகவே True/False மதிப்புகளைக் கொண்டுள்ளன, எ.கா. இடுகையிலுள்ள allowComments. True/False மதிப்பைப் பெறுவதற்கு, தரவின் பிற பகுதிகளுடன் குறிப்பிட்ட மதிப்புகளை ஒப்பிடலாம். சில எடுத்துக்காட்டுகள் இதோ:

• <b:if cond='data:post.showBacklinks'>
  பின்னிணைப்புகளைக் காட்டுமாறு தற்போதைய இடுகையை அமைத்திருந்தால் True.
• <b:if cond='data:blog.pageType == "item"'>
  தற்போதைய பக்கம் ஓர் ஆவணப் பக்கமாக (இடுகைப் பக்கம்) இருந்தால் True.
• <b:if cond='data:blog.pageType == "item" and data:post.showBacklinks'>
  தற்போதைய பக்கம் ஓர் ஆவணப் பக்கமாக (இடுகைப் பக்கம்) இருந்து, பின்னிணைப்புகளைக் காட்டுமாறு தற்போதைய இடுகை அமைக்கப்பட்டிருந்தால் True.
• <b:if cond='data:displayname != "Fred"'>
  இது Fredன் காட்சிப் பெயர் இல்லை எனில் True.
• <b:if cond='data:displayname == "Fred" or data:blog.pageType == "static_page"'>
  Fred என்பது காட்சிப் பெயர்தான் என்றாலோ தற்போதைய பக்கம் ஒரு நிலையான பக்கம் (அதாவது இடுகைப் பக்கம் அல்ல) என்றாலோ True.
• <b:if cond='data:post.numComments > 1'>
  தற்போதைய இடுகையில் ஒன்றுக்கு மேற்பட்ட கருத்துகள் இருந்தால் True.
• <b:if cond='data:blog.pageType in {"static_page", "item"}'> அல்லது <b:if cond='{"static_page", "item"} contains data:blog.pageType'>
  தற்போதைய பக்கம் ஒரு குறிப்பிட்ட இடுகை அல்லது ஒரு பக்கம் எனில் True.

தரவு மாறிகளின் அடிப்படையில் சிக்கலான நடைப் பண்புக்கூறுக்கு, உள்ளாக இடப்படும் HTMLலை எளிதாகப் படிக்கும் வகையில் மீதியுள்ள HTML வெளியீட்டிற்கு முன்னர் இதை நீங்கள் கணக்கிடலாம்.

<b:with var='style'
       value='"background-image: url(\"" + data:sourceUrl "\"); "
           + " width: " + data:width + "px; " '>
 <div id='header-outer'>   
   <div id='header-inner' expr:style='data:style'>
     <h1>எனது மேற்குறிப்பு</h1>
   </div>
 </div>
</b:with>

b:with குறிச்சொல்லின் உபநிலை நோடுகளுக்கு மட்டும் அந்த மாறி இருக்கும் என்பதைக் கவனத்தில் கொள்க.

இந்த விட்ஜெட்டில் b:widget, b:includable (மற்றும் b:include), b:if (மற்றும் b:else) மற்றும் b:loop ஆகிய குறிச்சொற்களைப் பயன்படுத்துவது குறித்த உதாரணத்தைப் பார்க்கலாம்.

 

<b:widget id='PageList1' locked='false' title='Pages' type='PageList'>
  <b:includable id='main'>
    <b:if cond='data:title != ""'>
      <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
      <b:if cond='data:mobile'>
        <select expr:id='data:widget.instanceId + "_select"'>
        <b:loop values='data:links' var='link'>
          <b:if cond='data:link.isCurrentPage'>
            <option expr:value='data:link.href' selected='selected'><data:link.title/></option>
          <b:else/>
            <option expr:value='data:link.href'><data:link.title/></option> 
          </b:if>
        </b:loop>
        </select>
        <span class='pagelist-arrow'>&amp;#9660;</span>
      <b:else/>
        <ul>
        <b:loop values='data:links' var='link'>
          <b:if cond='data:link.isCurrentPage'>
            <li class='selected'>
              <a expr:href='data:link.href'><data:link.title/></a>
            </li>
          <b:else/>
            <li>
              <a expr:href='data:link.href'><data:link.title/></a>
            </li>
          </b:if>
        </b:loop>
        </ul>
      </b:if>
      <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>