تحميل قالب Salbuta قالب بلوجر احترافي وأنيق

قالب Salbuta قالب من قوالب بلوجر ذات الجمال الذي لا يوصف، القالب له أشكال عديدة وقمة الروعة؛ حيث له تقريبا أكثر من شكل قمة الجمال والاحترافية

تصميم احترافي ومتميز لجعله قالب مدونتك، يمكنك استخدامه في المدونات الشخصية أو مدونة معرض لأعمالك أو مجلات أو أي مجال تريد لأنه قابل للتخصيص بشكل كامل

يدعم عرض الإعلانات بشكل احترافي داخل مقالاتك، سريع التحميل

أشكال أزرار رائعة وبألوان متناسقة ومبهجة، تصميم القالب يجعلك تشعر وكأنك تتصفح مجلة الكترونية جميلة

أنصحك بتجربة هذا القالب لما يحتويه من أدوات وإضافات وإعدادات تخصيص تجعل من مدونتك أكثر احترافية وجمالا

القالب حديث وجديد حيث تم إنشاؤه 20 أبريل 2019 وآخر تحديث له 2 مايو 2019

معاينة القالب النسخة العربية
معاينة القالب النسخة الانجليزية

من مميزات قالب Salbuta:

يحتوي على أكثر من شكل تصميم

متجاوب ومتوافق مع كل الشاشات

تصميم احترافي وألوان جذابة

أزرار مرنة واحترافية

قالب مدونة شخصية

قالب مجلة

تخصيص كامل

يدعم عرض الإعلانات

3 أعمدة بالفوتر Footer

تغيير خلفية الفوتر Footer ورأس الصفحة Header

قوائم منسدلة

قائمة ميجا Mega وقائمة ميجا متعددة Mega Multi

إليك بعض الإعدادات التي تساعدك في جعل مدونتك أكثر احترافية:

إعدادات المدونة:

اذهب إلي لوحة التحكم بلوجر ثم "إعدادات"

ثم اضغط "الأساسية"

ابحث عن قراءة المدونة الإلكترونية ثم اجعلها "علني"

ثم اختر "المشاركات والتعليقات والمشاركة"

الحد الأقصي لما يتم عرضه:

ضع رقم المشاركات التي تريد في كل صفحة

عرض الصور في العرض المبسط يمكنك ضغط "نعم أو لا"

ثم التعليقات اجعلها "مضمن"

وقم بإعداد الإشراف على التعليقات كما تريد

ثم اختر إعدادات البحث من "العلامات الوصفية"

في الوصف اكتب وصفك عن مدونتك بحد أقصي 150 حرفا

ثم اختر أخري

السماح بخلاصة موقع الويب اجعلها "قصير"

ثم احفظ الإعدادات

تثبيت القالب Template Installation:

قم بتسجيل الدخول إلي لوحة تحكم بلوجر لمدونتك

ثم اذهب إلي "المظهر"

ثم اضغط نسخ احتياطي/استعادة

اضغط تنزيل المظهر لتحتفظ بنسخة احتياطية من القالب القديم في حالة تحتاجه مرة أخري

ثم اختر ملف القالب الجديد الذي امتداده ينتهي بـ .xml

ثم اضغط تحميل

خيارات إعداد القالب:

اذهب إلي لوحة تحكم بلوجر ثم "المظهر"

ثم تعديل HTML

ثم اضغط (ctrl+f) من لوحة مفاتيحك ثم ابحث عن الكود التالي

احذف هذا الكود السابق ثم انسخ الكود التالي والصقه بدلا منه:

ايقونات مواقع التواصل الاجتماعي Social Icons

اذهب إلي لوحة التحكم ثم "التخطيط"

ثم تعديل Social Icons في Link list

اسماء مواقع التواصل الاجتماعي المدعومة:

facebook, twitter, youtube, whatsapp, wordpress, github, google, instagram, tumblr, pinterest, behance, dribble, flickr, foursquare, github-alt, gitter, joomla, linkedin, pagekit, reddit, soundcloud, tripadvisor, uikit, vimeo, xing, yelp

ادخل اسم أي ايقونة تواصل في اسم موقع جديد ثم ضع الرابط

ثم اضغط ارتباط

ثم حفظ

إعدادات القائمة Menu:

من لوحة تحكم بلوجر ثم "التخطيط"

ثم تعديل Menu بتعديل إضافة الأداة HTML/JavaScript

انسخ الكود التالي ثم الصقه في الأداة

<li><a href='#'>Pages</a>

<ul>

<li><a href="#!">Custom Pages</a>

<ul>

<li><a href="/2018/02/">Archive Page</a></li>

<li><a href="/search/label/Nature">Label page</a></li>

<li><a href="/search?q=How&max-results=9">Search Page</a></li>

</ul>

</li>

<li><a href="/p/static-page.html">Static Page</a></li>

<li><a href="/p/typography.html">Typography</a></li>

<li><a href="/p/short-codes.html">Short Codes</a></li>

</ul>

</li>

<li><a href='#'>Posts</a>

<ul>

<li><a href="/2017/05/how-star-isn-as-bad-as-you-think.html">Post with right sidebar</a></li>

<li><a href="/2018/02/mars-can-get-you-your-heart-desire.html">Post with left sidebar</a></li>

<li><a href="/2018/01/cards-could-help-you-win-game.html">Post without sidebar</a></li>

<li><a href="/2018/02/layers-of-july-will-be-hidden.html">Post with full width title</a></li>

</ul>

</li>

</li>

<li><a href="#">Multi Mega</a>

</li>

<li><a href='/404'>Error 404</a></li>

ثم حفظ

التسميات أو التصنيفات Filtering Labels:

من لوحة التحكم ثم "التخطيط"

ثم تعديل Filtering Labels

بعد ذلك يمكنك اختيار كل التصنيفات أو تقوم بتحديد عدد معين من التصنيفات أو التسميات التي ستظهر

ثم اختر شكل ظهورها سواء كان شكل قائمة أو شكل سحابة

ثم اضغط حفظ

صندوق المؤلف أو الكاتب:

لإظهار الملف الشخصي للمؤلف أو الكاتب Author Profile

من لوحة التحكم ثم "إعدادات"

ثم "إعدادات المستخدم"

ثم تعديل ملفك الشخصي

ايقونات مواقع التواصل الاجتماعي بالفوتر Footer:

من لوحة التحكم بلوجر ثم "التخطيط"

ثم تعديل Footer Social Icons

اسماء مواقع التواصل الاجتماعي المدعومة:

ادخل اسم أي ايقونة تواصل في اسم موقع جديد ثم ضع الرابط

ثم اضغط ارتباط

ثم حفظ

تخصيص تصميم القالب:

لوحة تحكم بلوجر ثم "المظهر"

ثم اضغط "تخصيص"

تستطيع تغيير صورة الخلفية للقالب واللون الأساسي

ومن "متقدم" اعداد عام Global

يمكنك تغيير الخطوط Font، الألوان Text Color، ألوان الروابط Link Color، ولون الـ hoverللرابط عندما تأشر بالماوس عليه Hover Link Color

اعداد راس الصفحة Header

Background Color 1 لون الخلفية الأولي لرأس الصفحة

Background Color 2 لون الخلفية الثانية المتداخلة مع الخلفية الاولي لرأس الصفحة

اعداد الفوتر Footer

Background Color 1 لون الخلفية الأولي للفوتر Footer

Background Color 2 لون الخلفية الثانية المتداخلة مع الخلفية الاولي للفوتر Footer

اعداد Add CSS

تستطيع إضافة أي كود CSS إذا أردت التغيير في القليل من تصميم القالب

اعداد Gadgets

تستطيع إظهار أو إخفاء الإضافات Gadgets داخل مدونتك عن طريق وضع علامة أو عدم وضعها

تستطيع أيضا تعديل اي إضافة من الإضافات(الصفحات، الارشيف، التسميات، ايقونات مواقع التواصل الاجتماعي،......

ملحوظة مهمة جدااا: قبل التغيير في أي شئ من القالب لتخصيصه عليك أن تأخذ نسخة احتياطية من القالب أولا في حين أخطأت في التخصيص أو أردت الرجوع إلي شكل القالب كما كان

بعدما تغير إعداداتك لتخصيص القالب اضغط "تطبيق على المدونة"

الأكواد القصيرة Short Codes:

لكتابة أي كود قصير في مقالتك ادخل إلي لوحة التحكم بلوجر ثم المشاركات ثم تعديل المشاركة التي تريدها أو مشاركة جديدة

ثم تعديل Html

إضافة العناوين Headings:

H1 Heading

H2 Heading

H3 Heading

H4 Heading

H5 Heading

H6 Heading

استخدم من <h1> إلي <h6>

<h1>H1 Heading</h1>

<h2>H2 Heading</h2>

<h3>H3 Heading</h3>

<h4>H4 Heading</h4>

<h5>H5 Heading</h5>

<h6>H6 Heading</h6>

أضف

.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6 كتمييز بين كل نوع عنوان على سبيل المثال إذا أردت مثلا حجم h1 مثل حجم h3 فيمكنك الوصول للعنوان والتغيير بسهولة

<span class="uk-h1">H1 Heading</span>

<span class="uk-h2">H2 Heading</span>

<span class="uk-h3">H3 Heading</span>

<span class="uk-h4">H4 Heading</span>

<span class="uk-h5">H5 Heading</span>

<span class="uk-h6">H6 Heading</span>

لإضافة Addresses عنوانك الشخصي

مثال:

Twitter, Inc.

795 Folsom Ave, Suite 600

San Francisco, CA 94107

P: (123) 456-7890

تكتب الكود التالي:

<strong>Twitter, Inc.</strong><br>

795 Folsom Ave, Suite 600<br>

San Francisco, CA 94107<br>

<abbr title="Phone">P:</abbr> (123) 456-7890

</address>

لإضافة قوائم منظمة وغير منظمة:

القائمة المنظمة ومرتبة بأرقام Ordered list :

<ul>

<li>Facilisis in pretium nisl aliquet</li>

<li>Nulla volutpat aliquam velit

<ul>

<li>Phasellus iaculis neque</li>

<li>Purus sodales ultricies</li>

<li>Vestibulum laoreet porttitor sem</li>

<li>Ac tristique libero volutpat at</li>

</ul>

</li>

<li>Faucibus porta lacus fringilla vel</li>

</ul>

القائمة غير منظمة ومرتبة بأشكال دائرة أو غيرهاUnordered list :

<ul>

<li>Facilisis in pretium nisl aliquet</li>

<li>Nulla volutpat aliquam velit

<ul>

<li>Phasellus iaculis neque</li>

<li>Purus sodales ultricies</li>

<li>Vestibulum laoreet porttitor sem</li>

<li>Ac tristique libero volutpat at</li>

</ul>

</li>

<li>Faucibus porta lacus fringilla vel</li>

</ul>

لإضافة الجدول Table:

الكود التالي لجدول Divider Table

<thead>

<tr>

<th>Table Heading</th>

</tr>

</thead>

<tbody>

<tr>

<td>Table Data</td>

</tr>

<tr>

<td>Table Data</td>

</tr>

<tr>

<td>Table Data</td>

</tr>

</tbody>

</table>

</div>

الكود التالي لجدول Striped Table

<thead>

<tr>

<th>Table Heading</th>

</tr>

</thead>

<tbody>

<tr>

<td>Table Data</td>

</tr>

<tr>

<td>Table Data</td>

</tr>

<tr>

<td>Table Data</td>

</tr>

</tbody>

</table>

</div>

كيفية عمل عارض صور Slideshow:

لعمل Slideshow قم بإضافة data-uk-slideshow كـ attribute لمحتوي عنصر الـ <div> ثم قم بإضافة الخواص التالية لهذا الـ attribute :

animation: push; autoplay: true; autoplay-interval: 4000

بهذا الشكل:

</div>

ثم أضف <div> آخر داخله

</div>

</div>

وداخل الـ <div> قم بإضافة قائمة ul ليصبح الكود هكذا كالتالي:

</ul>

</div>

</div>

ثم إضافة صورة لكل عنصر داخل القائمة ليصبح الكود هكذا:

<li>

</li>

<li>

</li>

<li>

</li>

</ul>

</div>

</div>

قالب Salbut... مجلة ... جمال تصميم ... بساطة

معاينة القالب النسخة العربية

معاينة القالب النسخة الانجليزية

أكاديمية المهندس

تحميل قالب Salbuta قالب بلوجر احترافي وأنيق

مرسلة بواسطة Ahmed Kotb

نموذج الاتصال