လွၵ်းလၢႆးထီႉ 1 – ၸႂ်ႉ Joomla API (addStyleSheet
)
- ဢဝ် PHP code ပႃႈတႂ်ႈၼႂ်ႉၵႂႃႇသႂ်ႇၼႂ်းၵႄႈထႅဝ်လိၵ်ႈ <head> ၶွင်ၾႆႇ index.php (ၵမ်ႈပႃႈၼမ်တေမီးတီႈ
/templates/your_template_name/index.php
)
PHP
<?php
$this->addStyleSheet('https://cdn.jsdelivr.net/gh/ShanFont/ShanFont@main/shan.css');
?>
ပိူင်တႅၵ်ႈ
PHP
<!DOCTYPE html>
<html>
<head>
<jdoc:include type="head" />
<?php
$this->addStyleSheet('https://cdn.jsdelivr.net/gh/ShanFont/ShanFont@main/shan.css');
?>
</head>
2. ၸႂ်ႉၾွၼ်ႉၼႂ်းၾႆႇ CSS
ၼႂ်းၾႆႇ (template.css ဢမ်ႇၼၼ် custom.css) ၼၼ်ႉ ႁႂ်ႈၸႂ်ႉ code ပႃႈတႂ်ႈၼႆႉ
CSS
/* Load Shan Font Globally for Joomla */
body, html, p, span, div, a, li, ul, ol, h1, h2, h3, h4, h5, h6, blockquote, strong, em, b, i, button, input, textarea, select, label, table, th, td, nav, footer, header, section, article, aside, form, address, figcaption, fieldset, legend, details, summary, .moduletable, .module, .item-title, .nav, .breadcrumb, .btn, .card, .dropdown-menu, .dropdown-item, .jumbotron, .alert, .badge, .carousel, .modal, .form-control, .custom-control, .input-group, .accordion, .pagination, .pager, .list-group, .list-group-item, .media, .media-body, .navbar, .navbar-nav, .navbar-brand, .footer, .header, .joomla, .component, .content, .content-wrapper, .item-page, .category-desc, .categories-list, .page-header, .page-footer {
font-family: 'Shan', sans-serif !important;
line-height: 1.6em !important;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
လွၵ်းလၢႆးထီႉ 2 – ၸႂ်ႉ Direct Link Method (လၢႆးဝႆး)
- ၵႂႃႇတီႈၾႆႇ index.php ဢၼ်ၶႂ်ႈႁႂ်ႈပဵၼ်ၾွၼ်ႉတႆးသေ သႂ်ႇၶူတ်ႉပႃႈတႂ်ႈၼႆႉၼႂ်း <head>
HTML
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ShanFont/ShanFont@main/shan.css">
ပိူင်တႅၵ်ႈ
PHP
<!DOCTYPE html>
<html>
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ShanFont/ShanFont@main/shan.css">
</head>
မၢႆတွင်း – ၼႂ်း url( ) ၼၼ်ႉႁဵတ်းႁႂ်ႈတီႈယူႇၾႆႇၶွင်ၾွၼ်ႉမၼ်းထုၵ်ႇမႅတ်ႈ
2. ၸႂ်ႉၾွၼ်ႉၼႂ်းၾႆႇ CSS
ၼႂ်းၾႆႇ (template.css ဢမ်ႇၼၼ် custom.css) ၼၼ်ႉ ႁႂ်ႈၸႂ်ႉ code ပႃႈတႂ်ႈၼႆႉ
CSS
/* Load Shan Font Globally for Joomla */
body, html, p, span, div, a, li, ul, ol, h1, h2, h3, h4, h5, h6, blockquote, strong, em, b, i, button, input, textarea, select, label, table, th, td, nav, footer, header, section, article, aside, form, address, figcaption, fieldset, legend, details, summary, .moduletable, .module, .item-title, .nav, .breadcrumb, .btn, .card, .dropdown-menu, .dropdown-item, .jumbotron, .alert, .badge, .carousel, .modal, .form-control, .custom-control, .input-group, .accordion, .pagination, .pager, .list-group, .list-group-item, .media, .media-body, .navbar, .navbar-nav, .navbar-brand, .footer, .header, .joomla, .component, .content, .content-wrapper, .item-page, .category-desc, .categories-list, .page-header, .page-footer {
font-family: 'Shan', sans-serif !important;
line-height: 1.6em !important;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
ပိူင်တႅၵ်ႈၵၢၼ်ၸႂ်ႉၾွၼ်ႉ Shan ပုၼ်ႈတႃႇႁူဝ်ၶေႃႈ headings
CSS
h1 {
font-weight: 900;
}
h2 {
font-weight: 700;
}
p {
font-weight: 400;
}
.thin {
font-weight: 100;
}
.italic {
font-style: italic;
}
တၢင်းၼႃတူဝ်လိၵ်ႈ
Font Style | CSS Settings |
---|---|
Shan Thin | font-weight: 100; |
Shan Thin Italic | font-weight: 100; font-style: italic; |
Shan Regular | font-weight: 400; |
Shan Regular Italic | font-weight: 400; font-style: italic; |
Shan Bold | font-weight: 700; |
Shan Bold Italic | font-weight: 700; font-style: italic; |
Shan Black | font-weight: 900; |
Shan Black Italic | font-weight: 900; font-style: italic; |
မၢႆတွင်း
- ႁႂ်ႈသႂ်ႇၾွၼ်ႉ Shan ၼႂ်း template files ဢမ်ႇၸႂ်ႈတီႈ Joomla core files ပုၼ်ႈတႃႇႁႄႉၵင်ႈဢမ်ႇၸႂ်ႉၾွၼ်ႉလႆႈမိူဝ်ႈမီးၵၢၼ် update
- သၢႆးသေသႂ်ႇၾွၼ်ႉ Shan ယဝ်ႉၶိုၼ်းမႄး clear cache ပၼ်ၵမ်းၼိုင်ႈ System → Clear Cache.