Draft:Template:Article: Difference between revisions

From AbhiprayaVedi
← Older editNewer edit →
VisualWikitext
No edit summary
No edit summary
Line 1: Line 1:
<includeonly>
<includeonly>
{{DISPLAYTITLE:{{{DisplayTitle|{{{Title|}}}}}}}}
{{DISPLAYTITLE:{{{DisplayTitle|{{{Title|}}}}}}}}
<!-- Custom CSS for Modern Design -->
<style>
.article-container {
    max-width: 1200px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.article-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 40px;
    border-radius: 12px;
    margin-bottom: 30px;
    box-shadow: 0 10px 30px rgba(102, 126, 234, 0.3);
}
.article-meta-box {
    background: linear-gradient(135deg, #e0e7ff 0%, #cfd9ff 100%);
    border-left: 5px solid #4c51bf;
    padding: 20px;
    margin: 25px 0;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.introduction-box {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border-left: 5px solid #f59e0b;
    padding: 25px;
    margin: 25px 0;
    border-radius: 8px;
    font-size: 1.15em;
    line-height: 1.9;
    color: #78350f;
    font-weight: 500;
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.15);
}
.left-sidebar {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #fbbf24;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(251, 191, 36, 0.2);
}
.right-sidebar {
    background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
    border: 2px solid #34d399;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(52, 211, 153, 0.2);
}
.sidebar-title {
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 1.1em;
    padding-bottom: 10px;
    border-bottom: 2px solid rgba(0,0,0,0.1);
}
.highlight-box {
    background: white;
    padding: 12px;
    margin-bottom: 12px;
    border-radius: 6px;
    border-left: 4px solid #10b981;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.keypoint-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.keypoint-list li {
    padding: 10px;
    margin-bottom: 8px;
    background: white;
    border-radius: 6px;
    border-left: 4px solid #f59e0b;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.keypoint-list li:before {
    content: "▸ ";
    color: #f59e0b;
    font-weight: bold;
    margin-right: 8px;
}
.source-box {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #fbbf24;
    border-radius: 8px;
    padding: 18px;
    margin: 30px 0;
    box-shadow: 0 4px 12px rgba(251, 191, 36, 0.15);
}
.author-bio-box {
    background: linear-gradient(135deg, #e0e7ff 0%, #cfd9ff 100%);
    padding: 25px;
    margin: 35px 0 25px 0;
    border-top: 4px solid #667eea;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}
.article-content {
    font-size: 1.08em;
    line-height: 1.9;
    color: #1f2937;
    text-align: justify;
}
.article-content p {
    margin-bottom: 1.2em;
}
@media (max-width: 768px) {
    .article-layout {
        flex-direction: column !important;
    }
   
    .left-sidebar, .right-sidebar {
        flex: 1 1 auto !important;
        margin-bottom: 20px;
    }
}
</style>
<div class="article-container">
<!-- Article Header -->
<div class="article-header">
<h1 style="margin: 0 0 15px 0; font-size: 2.5em; text-shadow: 2px 2px 4px rgba(0,0,0,0.2);">{{{DisplayTitle|{{{Title|}}}}}}</h1>
<div style="font-size: 1.1em; opacity: 0.95;">
{{#if:{{{OriginalAuthor|}}}|
<strong>യഥാർത്ഥ രചയിതാവ്:</strong> {{{OriginalAuthor|}}} | <strong>പരിഭാഷ:</strong> {{{Author|}}}
|
<strong>രചയിതാവ്:</strong> {{{Author|}}}
}}
| <strong>തീയതി:</strong> {{{Date|}}} | <strong>വിഭാഗം:</strong> {{{Category|}}}
</div>
</div>


<!-- Main Content Area with Sidebars -->
<!-- Main Content Area with Sidebars -->
<div style="display: flex; gap: 20px; margin: 20px 0;">
<div class="article-layout" style="display: flex; gap: 25px; margin: 20px 0;">


<!-- Left Sidebar - Key Points -->
<!-- Left Sidebar - Key Points -->
{{#if:{{{KeyPoint1|}}}|
{{#if:{{{KeyPoint1|}}}|
<div class="left-sidebar" style="flex: 0 0 200px; background: #fffacd; border: 2px solid #f0e68c; border-radius: 5px; padding: 15px; font-size: 0.9em;">
<div class="left-sidebar" style="flex: 0 0 220px;">
<div style="font-weight: bold; color: #8b4513; margin-bottom: 10px; font-size: 1.1em;">📌 പ്രധാന പോയിന്റുകൾ</div>
<div class="sidebar-title" style="color: #92400e;">📌 പ്രധാന പോയിന്റുകൾ</div>
<ul style="margin: 0; padding-left: 20px;">
<ul class="keypoint-list">
{{#if:{{{KeyPoint1|}}}|<li>{{{KeyPoint1|}}}</li>}}
{{#if:{{{KeyPoint1|}}}|<li>{{{KeyPoint1|}}}</li>}}
{{#if:{{{KeyPoint2|}}}|<li>{{{KeyPoint2|}}}</li>}}
{{#if:{{{KeyPoint2|}}}|<li>{{{KeyPoint2|}}}</li>}}
Line 20: Line 170:
<!-- Main Content Column -->
<!-- Main Content Column -->
<div class="main-content-column" style="flex: 1; min-width: 0;">
<div class="main-content-column" style="flex: 1; min-width: 0;">
<!-- Article Metadata - Prominent -->
<div class="article-meta" style="font-size: 1.1em; margin-bottom: 25px; padding: 15px; background: #f5f5f5; border-left: 4px solid #0645ad; border-radius: 3px;">
{{#if:{{{OriginalAuthor|}}}|
'''യഥാർത്ഥ രചയിതാവ് (Original Author):''' {{{OriginalAuthor|}}} | '''പരിഭാഷ (Translated by):''' {{{Author|}}} | '''തീയതി (Date):''' {{{Date|}}} | '''വിഭാഗം (Category):''' {{{Category|}}}
|
'''രചയിതാവ് (Author):''' {{{Author|}}} | '''തീയതി (Date):''' {{{Date|}}} | '''വിഭാഗം (Category):''' {{{Category|}}}
}}
</div>


<!-- Thumbnail -->
<!-- Thumbnail -->
{{#if:{{{Thumbnail|}}}|
{{#if:{{{Thumbnail|}}}|
<div style="float: right; margin: 0 0 15px 15px;">
<div style="float: right; margin: 0 0 20px 20px;">
[[File:{{{Thumbnail}}}|thumb|300px|{{{ThumbnailCaption|}}}]]
[[File:{{{Thumbnail}}}|thumb|350px|{{{ThumbnailCaption|}}}]]
</div>
</div>
|}}
|}}


<!-- Introduction Section with Special Styling -->
<!-- Introduction Section -->
<div class="article-introduction" style="background: linear-gradient(to right, #e3f2fd, #ffffff); padding: 20px; margin: 0 0 25px 0; border-left: 5px solid #2196f3; border-radius: 3px; font-size: 1.15em; line-height: 1.8; color: #1565c0; font-weight: 500;">
<div class="introduction-box">
{{{Introduction|}}}
{{{Introduction|}}}
</div>
</div>


<!-- Main Article Content with embedded image in middle -->
<!-- Main Article Content -->
<div class="article-content" style="font-size: 1.05em; line-height: 1.8; text-align: justify;">
<div class="article-content">
{{#if:{{{Image1|}}}|
{{#if:{{{Image1|}}}|
<!-- Split content to insert image in middle -->
<!-- Content with embedded image -->
{{{Content|}}}
{{{Content|}}}


<div style="margin: 30px 0; text-align: center; clear: both;">
<div style="margin: 35px 0; clear: both;">
[[File:{{{Image1}}}|thumb|center|650px|{{{Image1Caption|}}}]]
[[File:{{{Image1}}}|thumb|center|700px|{{{Image1Caption|}}}]]
</div>
</div>
|
|
<!-- No image, just content -->
<!-- Content without image -->
{{{Content|}}}
{{{Content|}}}
}}
}}
</div>
</div>


<!-- Additional Images (Image 2 and 3 only) -->
<!-- Additional Images -->
{{#if:{{{Image2|}}}|
{{#if:{{{Image2|}}}|
<div class="article-images" style="margin: 30px 0;">
<div style="margin: 35px 0;">
<div style="margin: 20px 0; text-align: center;">
<div style="margin: 25px 0;">
[[File:{{{Image2}}}|thumb|center|600px|{{{Image2Caption|}}}]]
[[File:{{{Image2}}}|thumb|center|650px|{{{Image2Caption|}}}]]
</div>
</div>
{{#if:{{{Image3|}}}|
{{#if:{{{Image3|}}}|
<div style="margin: 20px 0; text-align: center;">
<div style="margin: 25px 0;">
[[File:{{{Image3}}}|thumb|center|600px|{{{Image3Caption|}}}]]
[[File:{{{Image3}}}|thumb|center|650px|{{{Image3Caption|}}}]]
</div>
</div>
}}
}}
Line 73: Line 214:
</div>
</div>


<!-- Right Sidebar - Highlights/Quick Facts -->
<!-- Right Sidebar - Highlights -->
{{#if:{{{Highlight1|}}}|
{{#if:{{{Highlight1|}}}|
<div class="right-sidebar" style="flex: 0 0 220px; background: #e8f5e9; border: 2px solid #81c784; border-radius: 5px; padding: 15px; font-size: 0.9em;">
<div class="right-sidebar" style="flex: 0 0 240px;">
<div style="font-weight: bold; color: #2e7d32; margin-bottom: 10px; font-size: 1.1em;">💡 പ്രത്യേക ശ്രദ്ധയ്ക്ക്</div>
<div class="sidebar-title" style="color: #065f46;">💡 പ്രത്യേക ശ്രദ്ധയ്ക്ക്</div>
<div style="line-height: 1.6;">
{{#if:{{{Highlight1|}}}|
{{#if:{{{Highlight1|}}}|
<div style="background: white; padding: 10px; margin-bottom: 10px; border-radius: 3px; border-left: 3px solid #4caf50;">
<div class="highlight-box">
{{{Highlight1|}}}
{{{Highlight1|}}}
</div>
</div>
}}
}}
{{#if:{{{Highlight2|}}}|
{{#if:{{{Highlight2|}}}|
<div style="background: white; padding: 10px; margin-bottom: 10px; border-radius: 3px; border-left: 3px solid #4caf50;">
<div class="highlight-box">
{{{Highlight2|}}}
{{{Highlight2|}}}
</div>
</div>
}}
}}
{{#if:{{{Highlight3|}}}|
{{#if:{{{Highlight3|}}}|
<div style="background: white; padding: 10px; border-radius: 3px; border-left: 3px solid #4caf50;">
<div class="highlight-box">
{{{Highlight3|}}}
{{{Highlight3|}}}
</div>
</div>
}}
}}
</div>
</div>
</div>
|}}
|}}
Line 99: Line 238:
</div>
</div>


<!-- Source Attribution Section - Compact -->
<!-- Source Attribution -->
{{#if:{{{SourceName|}}}|
{{#if:{{{SourceName|}}}|
<div class="source-attribution" style="background: #fff9e6; border: 1px solid #ffc107; border-radius: 3px; padding: 12px; margin: 25px 0 20px 0; font-size: 0.95em;">
<div class="source-box">
<strong style="color: #856404;">📰 സ്രോതസ്സ് (Source):</strong>  
<div style="font-weight: bold; color: #92400e; margin-bottom: 8px; font-size: 1.1em;">📰 സ്രോതസ്സ് (Source)</div>
{{{SourceName|}}}{{#if:{{{OriginalDate|}}}| • പ്രസിദ്ധീകരണം (Published): {{{OriginalDate|}}}}}{{#if:{{{SourceURL|}}}| • [{{{SourceURL|}}} യഥാർത്ഥ ലേഖനം (Original Article)]}}{{#if:{{{TranslationType|}}}| • തരം (Type): {{{TranslationType|}}}}}{{#if:{{{PermissionNote|}}}| • <em>{{{PermissionNote|}}}</em>}}
<div style="color: #78350f; line-height: 1.7;">
<strong>പ്രസിദ്ധീകരണം:</strong> {{{SourceName|}}}
{{#if:{{{OriginalDate|}}}|<br/><strong>യഥാർത്ഥ തീയതി:</strong> {{{OriginalDate|}}}}}
{{#if:{{{SourceURL|}}}|<br/><strong>ലിങ്ക്:</strong> [{{{SourceURL|}}} യഥാർത്ഥ ലേഖനം കാണുക]}}
{{#if:{{{TranslationType|}}}|<br/><strong>തരം:</strong> {{{TranslationType|}}}}}
{{#if:{{{PermissionNote|}}}|<br/><em>{{{PermissionNote|}}}</em>}}
</div>
</div>
</div>
|}}
|}}


<!-- Translator/Author Bio Section -->
<!-- Author/Translator Bio -->
{{#if:{{{Author_Bio|}}}|
{{#if:{{{Author_Bio|}}}|
<div class="author-bio" style="background: #f5f5f5; padding: 20px; margin: 30px 0 20px 0; border-top: 3px solid #9e9e9e; border-radius: 3px;">
<div class="author-bio-box">
<div style="font-size: 1.2em; color: #424242; font-weight: bold; margin-bottom: 10px;">
<div style="font-size: 1.3em; color: #4338ca; font-weight: bold; margin-bottom: 15px;">
{{#if:{{{OriginalAuthor|}}}|
{{#if:{{{OriginalAuthor|}}}|
✍️ പരിഭാഷകനെക്കുറിച്ച് (About the Translator)
✍️ പരിഭാഷകനെക്കുറിച്ച് (About the Translator)
Line 117: Line 262:
}}
}}
</div>
</div>
<div style="line-height: 1.6;">
<div style="line-height: 1.8; color: #312e81;">
{{{Author_Bio|}}}
{{{Author_Bio|}}}
</div>
</div>
</div>
</div>
|}}
|}}
</div>


<!-- Categories -->
<!-- Categories -->
Line 138: Line 285:
== Article Template Documentation ==
== Article Template Documentation ==


This template creates a beautifully formatted article page with:
This template creates a modern, beautifully formatted article page with gradient hues and improved mobile responsiveness.
* Custom display title (supports Malayalam)
 
* Prominent metadata line showing original author (for translations) or author
=== New Features ===
* Colored introduction section
* Modern gradient color scheme with purple, yellow, and green hues
* Optional left sidebar for key points
* Improved mobile responsiveness
* Optional right sidebar for highlights
* Enhanced typography and spacing
* Support for multiple images/charts within content (Image1 appears in middle of content)
* Shadow effects for depth
* Compact source attribution line for translations
* Better visual hierarchy
* Translator/Author bio section
* Smooth hover effects
* Automatic categorization (original author for translations, translator for translations)


=== Usage ===
=== Usage ===
<pre>
Same parameters as before, but with enhanced visual presentation.
{{Draft:Template:Article
|DisplayTitle=പ്രധാനപ്പെട്ട ലേഖനം
|Title=Important-Article
|Author=പരിഭാഷകന്റെ പേര് (for translations) or രചയിതാവിന്റെ പേര് (for originals)
|OriginalAuthor=യഥാർത്ഥ ലേഖകൻ (only for translations)
|Date=2026-01-14
|Category=Politics
|Thumbnail=Example.jpg
|ThumbnailCaption=Main image description
|Introduction=ലേഖനത്തിന്റെ ആമുഖം...
|Content=പ്രധാന ഉള്ളടക്കം...
|Image1=Chart1.png (appears in middle of article)
|Image1Caption=First chart description
|Image2=Photo2.jpg (appears at end)
|Image2Caption=Second photo description
|Author_Bio=പരിഭാഷകനെക്കുറിച്ച് or രചയിതാവിനെക്കുറിച്ച്...
|KeyPoint1=ആദ്യ പോയിന്റ്
|Highlight1=പ്രത്യേക ശ്രദ്ധയ്ക്ക്
|SourceName=The Hindu (for translations)
|OriginalDate=2026-01-10
|SourceURL=https://example.com/original-article
|TranslationType=Translation
|PermissionNote=Published with permission
}}
</pre>
 
=== Key Changes ===
* Page title (H1) appears only once at top (from MediaWiki default)
* Blue styled title removed
* Metadata line is larger (1.1em) and more prominent with background
* Original Author shows in metadata line for translations
* Translator name shows as "Translated by" in metadata
* Image1 appears in middle of content
* Source attribution is compact single line
* Author bio changes to "About Translator" for translations
* Categories show original author for translations
* Category display shows DISPLAYTITLE, not page name
 
=== Parameters ===
'''Basic Information:'''
* '''DisplayTitle''' (required): Title as displayed
* '''Title''' (required): Page name
* '''Author''' (required): Translator name (for translations) or Author (for originals)
* '''OriginalAuthor''' (optional): Original author name (only for translations)
* '''Date''' (required): Publication date
* '''Category''' (required): Article category
 
'''Content:'''
* '''Thumbnail''' (optional): Main image
* '''Introduction''' (required): Brief intro
* '''Content''' (required): Main text
* '''Image1''' (optional): Appears mid-article
* '''Image2-3''' (optional): Appear at end
 
'''Source (translations only):'''
* '''SourceName''', '''OriginalDate''', '''SourceURL''', '''TranslationType''', '''PermissionNote'''
 
'''Sidebars:'''
* '''KeyPoint1-4''', '''Highlight1-3'''
 
'''Bio:'''
* '''Author_Bio''' (changes to translator bio if OriginalAuthor is set)


[[Category:Templates]]
[[Category:Templates]]
</noinclude>
</noinclude>

Revision as of 23:35, 21 January 2026


Article Template Documentation

This template creates a modern, beautifully formatted article page with gradient hues and improved mobile responsiveness.

New Features

  • Modern gradient color scheme with purple, yellow, and green hues
  • Improved mobile responsiveness
  • Enhanced typography and spacing
  • Shadow effects for depth
  • Better visual hierarchy
  • Smooth hover effects

Usage

Same parameters as before, but with enhanced visual presentation.

Retrieved from "https://abhiprayavedi.org/index.php?title=Draft:Template:Article&oldid=232"