Jump to content

Template:Main page: Difference between revisions

From Wikigama
PS (talk | contribs)
No edit summary
Tag: Reverted
PS (talk | contribs)
No edit summary
Tag: Reverted
Line 1: Line 1:
<noinclude>
<noinclude>
This template formats the main page with a professional, unique design.
This template displays a professional main page with article cards.
To use it, replace the content of [[Main Page]] with:
To use it, replace the content of [[Main Page]] with:
{{Main page}}
{{Main page}}
</noinclude>
</noinclude>
<div class="mp-container">
<div class="mp-container">
   <!-- Hero Section with Gradient -->
   <!-- Hero Section -->
   <div class="mp-hero">
   <div class="mp-hero">
     <h1 class="mp-welcome">Welcome to {{SITENAME}}</h1>
     <h1 class="mp-welcome">Welcome to {{SITENAME}}</h1>
     <p class="mp-tagline">The knowledge base you can trust and contribute to.</p>
     <p class="mp-tagline">A growing collection of knowledge.</p>
    <!-- Optional statistics – remove if not wanted -->
     <div class="mp-stats">
     <div class="mp-stats">
       <span>📄 {{NUMBEROFARTICLES}} articles</span>
       <span>📄 {{NUMBEROFARTICLES}} articles</span>
Line 16: Line 17:
   </div>
   </div>


   <!-- Three Feature Cards -->
   <!-- Article Card Grid -->
   <div class="mp-feature-row">
   <div class="mp-card-grid">
     <div class="mp-feature-card">
    <!-- Card 1 -->
       <div class="mp-card-icon">🔍</div>
     <div class="mp-card">
       <h3>Explore</h3>
       <div class="mp-card-image">
       <p>Discover a wealth of information on diverse topics.</p>
        [[File:Placeholder.png|150px|link=Article 1|alt=Article image]]
       <a href="/wiki/Special:AllPages" class="mp-card-link">Browse articles →</a>
      </div>
       <h3 class="mp-card-title">[[Article 1|Article Title 1]]</h3>
       <p class="mp-card-description">Short description of the first article. It highlights the main topic and entices readers to click.</p>
       <a href="/wiki/Article_1" class="mp-card-link">Read more →</a>
     </div>
     </div>
     <div class="mp-feature-card">
    <!-- Card 2 -->
       <div class="mp-card-icon">✏️</div>
     <div class="mp-card">
       <h3>Contribute</h3>
       <div class="mp-card-image">
       <p>Share your knowledge and help improve our content.</p>
        [[File:Placeholder.png|150px|link=Article 2|alt=Article image]]
       <a href="/wiki/Help:Editing" class="mp-card-link">Start editing →</a>
      </div>
       <h3 class="mp-card-title">[[Article 2|Article Title 2]]</h3>
       <p class="mp-card-description">Short description of the second article. Keep it concise and engaging.</p>
       <a href="/wiki/Article_2" class="mp-card-link">Read more →</a>
     </div>
     </div>
     <div class="mp-feature-card">
     <!-- Card 3 -->
      <div class="mp-card-icon">🤝</div>
     <div class="mp-card">
      <h3>Community</h3>
       <div class="mp-card-image">
      <p>Join discussions and meet fellow contributors.</p>
         [[File:Placeholder.png|150px|link=Article 3|alt=Article image]]
      <a href="/wiki/Project:Community_portal" class="mp-card-link">Get involved →</a>
    </div>
  </div>
 
  <!-- Two‑Column Content Area -->
  <div class="mp-row">
    <!-- Left Column -->
     <div class="mp-col mp-col-left">
      <!-- Featured Article Box -->
       <div class="mp-box mp-featured-article">
         <h2><span class="mp-box-icon">🌟</span> Featured article</h2>
        <div class="mp-featured-content">
          [[File:Example.jpg|thumb|left|150px|alt=Example image]]
          '''Lorem ipsum''' dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
          <div style="clear:both"></div>
          <p class="mp-readmore">[[Main Page|Read more...]]</p>
        </div>
      </div>
      <!-- Did You Know Box -->
      <div class="mp-box mp-didyouknow">
        <h2><span class="mp-box-icon">❓</span> Did you know...</h2>
        <ul>
          <li>... that MediaWiki was originally written for Wikipedia?</li>
          <li>... you can create custom templates to reuse content?</li>
          <li>... this wiki has a [[Special:Random|random article]] feature?</li>
        </ul>
       </div>
       </div>
      <h3 class="mp-card-title">[[Article 3|Article Title 3]]</h3>
      <p class="mp-card-description">Short description of the third article. You can adjust the length as needed.</p>
      <a href="/wiki/Article_3" class="mp-card-link">Read more →</a>
     </div>
     </div>
 
     <!-- Card 4 -->
     <!-- Right Column -->
     <div class="mp-card">
     <div class="mp-col mp-col-right">
       <div class="mp-card-image">
      <!-- News Box -->
         [[File:Placeholder.png|150px|link=Article 4|alt=Article image]]
       <div class="mp-box mp-news">
        <h2><span class="mp-box-icon">📰</span> News</h2>
         <ul>
          <li><strong>March 2025:</strong> We reached 1,000 articles!</li>
          <li><strong>February 2025:</strong> New editor workshop on the 20th.</li>
          <li><strong>January 2025:</strong> Site design refresh launched.</li>
        </ul>
      </div>
      <!-- In the News Box -->
      <div class="mp-box mp-inthenews">
        <h2><span class="mp-box-icon">🌍</span> In the news</h2>
        <ul>
          <li>[[Project:Announcements|Annual community meeting]] – April 5</li>
          <li>[[Project:Fundraiser|Help us keep the wiki running]]</li>
        </ul>
       </div>
       </div>
      <h3 class="mp-card-title">[[Article 4|Article Title 4]]</h3>
      <p class="mp-card-description">Short description of the fourth article. Make it interesting.</p>
      <a href="/wiki/Article_4" class="mp-card-link">Read more →</a>
     </div>
     </div>
  </div>
    <!-- Card 5 (optional – remove if you only want 4) -->
 
     <div class="mp-card">
  <!-- Full‑Width Featured Picture -->
       <div class="mp-card-image">
  <div class="mp-full">
         [[File:Placeholder.png|150px|link=Article 5|alt=Article image]]
     <div class="mp-box mp-featured-picture">
      <h2><span class="mp-box-icon">🖼️</span> Today's featured picture</h2>
       <div class="mp-picture-container">
         [[File:Example.jpg|thumb|center|300px|A beautiful landscape]]
       </div>
       </div>
      <h3 class="mp-card-title">[[Article 5|Article Title 5]]</h3>
      <p class="mp-card-description">Short description of the fifth article. Add your own content here.</p>
      <a href="/wiki/Article_5" class="mp-card-link">Read more →</a>
     </div>
     </div>
   </div>
   </div>


   <!-- Footer Links -->
   <!-- Simple Footer -->
   <div class="mp-footer">
   <div class="mp-footer">
     <a href="/wiki/Project:About">About {{SITENAME}}</a> •
     <a href="/wiki/Project:About">About {{SITENAME}}</a> •
     <a href="/wiki/Special:RecentChanges">Recent changes</a> •
     <a href="/wiki/Special:RecentChanges">Recent changes</a> •
     <a href="/wiki/Help:Contents">Help</a> •
     <a href="/wiki/Help:Contents">Help</a>
    <a href="/wiki/Project:Contact">Contact</a>
   </div>
   </div>
</div>
</div>

Revision as of 19:21, 14 March 2026

This template displays a professional main page with article cards. To use it, replace the content of Main Page with:

Welcome to Wikigama

A growing collection of knowledge.

     📄 58 articles
     👥 15 users
     ✏️ 3,669 edits
       Article image

Article Title 1

Short description of the first article. It highlights the main topic and entices readers to click.

     <a href="/wiki/Article_1" class="mp-card-link">Read more →</a>
       Article image

Article Title 2

Short description of the second article. Keep it concise and engaging.

     <a href="/wiki/Article_2" class="mp-card-link">Read more →</a>
       Article image

Article Title 3

Short description of the third article. You can adjust the length as needed.

     <a href="/wiki/Article_3" class="mp-card-link">Read more →</a>
       Article image

Article Title 4

Short description of the fourth article. Make it interesting.

     <a href="/wiki/Article_4" class="mp-card-link">Read more →</a>
       Article image

Article Title 5

Short description of the fifth article. Add your own content here.

     <a href="/wiki/Article_5" class="mp-card-link">Read more →</a>

Welcome to Wikigama

A growing collection of knowledge.

     📄 58 articles
     👥 15 users
     ✏️ 3,669 edits
       Article image

Article Title 1

Short description of the first article. It highlights the main topic and entices readers to click.

     <a href="/wiki/Article_1" class="mp-card-link">Read more →</a>
       Article image

Article Title 2

Short description of the second article. Keep it concise and engaging.

     <a href="/wiki/Article_2" class="mp-card-link">Read more →</a>
       Article image

Article Title 3

Short description of the third article. You can adjust the length as needed.

     <a href="/wiki/Article_3" class="mp-card-link">Read more →</a>
       Article image

Article Title 4

Short description of the fourth article. Make it interesting.

     <a href="/wiki/Article_4" class="mp-card-link">Read more →</a>
       Article image

Article Title 5

Short description of the fifth article. Add your own content here.

     <a href="/wiki/Article_5" class="mp-card-link">Read more →</a>