قالب وردپرس خودتان را طراحی کنید

وردپرس چیست ؟

طراحی تم وردپرس worpdress
طراحی قالب وردپرس worpdress

وردپرس یک ابزار ایجاد وب سایت آنلاین با استفاده از پی اچ پی است.

در غیر این صورت به عنوان یک سیستم مدیریت محتوا (CMS) در سال 2003 آغاز شده است.

یک سیستم مدیریت محتوا (CMS) یک برنامه کامپیوتری است. این استفاده شده است

برای ایجاد و تغییر محتوای دیجیتال با استفاده از یک رابط کاربری رایج.

CMS از اواخر دهه 1990 در دسترس بوده است.

سیستم مدیریت محتوای وب نوعی سیستم مدیریت محتوا است که برای مدیریت محتوای صفحات وب مدیریت می شود

و در نتیجه محتوای وب سایت را مدیریت می کند.

همانطور که می دانیم انواع مختلفی از داده ها در محتوای وب وجود دارد.

اینها شامل موارد زیر می باشند: متن، صوتی، گرافیک، عکس و ویدیو، فقط برای اشاره به چند مورد.

سیستم مدیریت محتوا

طراحی تم وردپرس worpdress
طراحی تم وردپرس worpdress

چیست ؟

 

یک سیستم مدیریت محتوا شامل قطعات زیر است:

CMA: CMA مخفف برنامه مدیریت محتوای است.

این رابط کاربر در فضای باز است. این اجازه می دهد تا کاربر به راحتی مدیریت محتوای وب.

CDA: CDA مخفف Application Delivery Content است.

این اطلاعات را از CMA کامپایل می کند و صفحه وب را به روز می کند.

وردپرس CMS محبوب است.

با توجه به بررسی انجام شده توسط w3techs نظرسنجی های تکنولوژی وب،

وردپرس به طور گسترده ای توسط 26.5 درصد از تمام وب سایت ها استفاده می شود

(https://w3techs.com/technologies/overview/content_management/all).

 

قالب وردپرس

قالب ایجاد ظاهر صفحه وب را ایجاد می کند.

قالب های وردپرس فایل هایی هستند که با هم کار می کنند تا طراحی و قابلیت وب سایت را ایجاد کنند.

قالب پیش فرض برای وردپرس وجود دارد.

این تم برای به نمایش گذاشتن ویژگی های وردپرس استفاده می شود،

بنابراین معمولا برای ایجاد یک وب سایت پایه ای مناسب است،

زیرا با ویژگی های بسیاری پر شده است.

البته این موضوع برای تغییرات سازگار است،

به طوری که به نظر می رسد مانند قالب پیش فرض.

بگذارید نگاهی بیشتر به چگونگی ایجاد یک وب سایت وردپرس بگیریم.

 

چرا یک قالب سفارشی وردپرس؟

طراحی تم وردپرس worpdress
طراحی تم وردپرس worpdress

1) برای ایجاد یک نگاه منحصر به فرد برای سایت وردپرس خود.

2) برای استفاده از قالب ها و تگ های قالب برای تولید نتایج مختلف وب سایت و به نظر می رسد.

3) این فرصتی است برای استفاده از تخصص شما با CSS، HTML و PHP.

4) این تجربه خلاقانه و سرگرم کننده است (اغلب اوقات).

 

استانداردهای توسعه قالب

استانداردهای مورد نیاز برای ایجاد قالب وردپرس وجود دارد.

دستورالعمل ها در زیر فهرست شده اند.

1) استفاده از PHP ساختار خوب، بدون خطا و HTML معتبر

(نگاه کنید به استاندارد وردپرس Coding: (https://make.wordpress.org/core/handbook/best-practices/coding-standards/)

2) از یک CSS پاک و معتبر استفاده کنید.

CSS Coding Standard را در لینک زیر ببینید: (https://make.wordpress.org/core/handbook/best-practices/coding-standards/css/)

3) دستورالعمل طراحی در طراحی سایت و طرح بندی را دنبال کنید.

(اینجا را ببینید: https://codex.wordpress.org/Site_Design_and_Layout).

 

قالب وردپرس خودتان را بسازید

طراحی تم وردپرس worpdress
طراحی تم وردپرس worpdress

گام نخست در ساختن تم وردپرس خود، ایجاد زیر فهرست در دایرکتوری wp-content / themes است.

هر قالب در زیر فهرست دایرکتوری قالب ها زندگی می کند.

شما می توانید زیر شاخه را با کمک یک سرویس گیرنده FTP یا “مدیر فایل” در cPanel ایجاد کنید.

حالا وقت آن است که تصمیم بگیرید که چطور موضوع شما باید باشد.

برای ایجاد قالب به راحتی، شما باید در مورد فایل های قالب توسط وردپرس شناخته شده دانم. این فایل ها در زیر لیست شده اند.

style.css

این سبک اصلی است. این باید با موضوع شما گنجانده شود و باید حاوی اطلاعات مربوط به موضوع شما باشد.

rtl.css

سبک سبک Rtl. این امر به صورت خودکار صورت می گیرد اگر متن متن وب سایت راست به سمت چپ باشد.

این می تواند با استفاده از پلاگین RTLer تولید شود.

index.php

این قالب اصلی است. اگر موضوع شما قالب های خود را فراهم می کند، سپس index.php باید حضور داشته باشد.

comments.php

این قالب نظر است.

front-page.php

الگو صفحه اول

home.php

قالب صفحه اصلی، که به طور پیش فرض صفحه اول است.

اگر از صفحه اصلی استاتیک استفاده می کنید این الگو برای صفحه با آخرین پست هاست.

single.php

قالب تک پست این مورد زمانی مورد استفاده قرار می گیرد که یک پست تک درج شود.

اگر این موجود نیست، سپس index.php به عنوان الگوی پرس و جو استفاده می شود.

تک {{post-type} پی اچ پی

قالب تک پست مورد استفاده قرار می گیرد زمانی که یک پست از یک نوع پست سفارشی مورد پرسش قرار می گیرد.

برای مثال، single book.php برای نمایش پستهای منفرد از نوع پست سفارشی به نام “book” استفاده می شود.

Index.php اگر قالب پرس و جو برای نوع سفارشی وجود ندارد، استفاده می شود.

page.php

قالب صفحه این مورد زمانی استفاده می شود که یک صفحه شخصی مورد پرسش قرار گیرد.

category.php

قالب رده این مورد زمانی استفاده می شود که یک دسته سوال شود.

tag.php

قالب برچسب این زمانی است که یک تگ مورد پرسش قرار می گیرد.

taxonomy.php

اصطلاح قالب. این زمانی است که یک اصطلاح در یک طبقه بندی سفارشی مورد پرسش قرار می گیرد.

author.php

الگو نویسنده. این مورد زمانی استفاده می شود که یک نویسنده سوال کند.

date.php

قالب تاریخ / زمان. این زمانی است که یک تاریخ یا زمان مورد پرسش قرار گرفته است. (سال، ماه، روز، ساعت، دقیقه و ثانیه).

archive.php

قالب آرشیو. این مورد زمانی استفاده می شود که یک دسته، نویسنده یا تاریخ مورد سوء استفاده قرار بگیرد.

توجه داشته باشید که این قالب توسط category.php، author.php، and date.php برای انواع پرس و جو مربوطه مورد استفاده قرار می گیرد.

search.php

قالب نتایج جستجو این زمانی است که جستجو انجام می شود.

attachment.php

قالب پیوست این مورد هنگام مشاهده یک پیوست تک استفاده می شود.

image.php

الگو دلبستگی تصویر این مورد در هنگام مشاهده یک پیوست تصویر تنها مورد استفاده قرار می گیرد.

اگر وجود نداشته باشد، attachment.php استفاده خواهد شد.

404.php

الگو 404 یافت نشد. این مورد زمانی استفاده می شود که وردپرس نمی تواند یک پست یا صفحه ای پیدا کند که مطابق با پرس و جو باشد.

با این حال، یک تم میتواند شامل هر گونه شیوهنامه، تصاویر یا فایلهای دیگر باشد.

حداقل حداقل یک تم وردپرس شامل دو فایل است:

1) style.css

2) index.php

ما فایل هایی را که برای ایجاد یک صفحه وب معمولی، خوب وجود دارد مورد بررسی قرار خواهیم داد.

header.php – این فایل حاوی کد بخش هدر موضوع است.

index.php – این فایل اصلی برای موضوع است.

این کد شامل منطقه اصلی خواهد بود و مشخص خواهد کرد که کدام فایل های دیگر شامل خواهد شد.

sidebar.php – این فایل حاوی اطلاعاتی درباره نوار کناری است.

footer.php- این فایل زیرساخت شما را مدیریت خواهد کرد.

style.css – این فایل سبک خود را از تم جدید خود در اختیار شما قرار می دهد.

قالب Child

ساده ترین قالب ممکن است موضوع کودک است که شامل تنها یک فایل style.css و هر تصویر است.

این امکان وجود دارد زیرا این یک کودک از موضوع دیگری است که به عنوان پدر و مادر عمل می کند.

شما می توانید این فایل ها را با یک ویرایشگر متن ساده مانند دفترچه یادداشت ایجاد کنید.

اجازه دهید هر فایل را به طور کامل مشاهده کنیم.

 

فایل header.php

<html>

<head>

<title>Tutorial theme</title>

<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>”>

</head>

<body>

<div id=”wrapper”>

<div id=”header”>

<h1>HEADER</h1>

</div>

This is a simple HTML code contains a PHP code in it. The next line which is,

<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>”> will tell the WordPress to load the style.css file.

<?php bloginfo(‘stylesheet_url’); ?> is the WordPress function which will load the “style.css” file.

 

 

فایل index.php

<?php get_header(); ?>

<div id=”main”>

<div id=”content”>

<h1>Main Area</h1>

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

<h1><?php the_title(); ?></h1>

<h4>Posted on <?php the_time(‘F jS, Y’) ?></h4>

<p><?php the_content(__(‘(more…)’)); ?></p>

<hr> <?php endwhile; else: ?>

<p><?php _e(‘Sorry, no posts matched your criteria.’); ?></p><?php endif; ?>

</div>

<?php get_sidebar(); ?>

</div>

<div id=”delimiter”>

</div>

<?php get_footer(); ?>

 

خط اول

<؟ php get_header ()؛ ؟>

فایل header.php و کد آن را در صفحه اصلی وارد کنید.

خط بعدی شامل فایل sidebar.php است. این در زیر آمده است.

<؟ php get_sidebar ()؛ ؟>

 

در نهایت، ما یک آخرین خط اضافه می کنیم

<؟ php get_footer ()؛ ؟>

که شامل فایل footer.php در صفحه وب است.

 

فایل sidebar.php

<div id=”sidebar”>

<h2 ><?php _e(‘Categories’); ?></h2>

<ul >

<?php wp_list_cats(‘sort_column=name&optioncount=1&hierarchical=0’); ?>

</ul>

<h2 ><?php _e(‘Archives’); ?></h2>

<ul >

<?php wp_get_archives(‘type=monthly’); ?>

</ul>

</div>

در این فایل، ما از توابع وردپرس داخلی برای نمایش دسته ها و آرشیوهای پست استفاده می کنیم.

 

فایل footer.php

<div id=”footer”>

<h1>FOOTER</h1>

</div>58

</div>

</body>

</html>

این برای اضافه کردن برچسب پاورقی ساده استفاده می شود.

شما می توانید لینک ها، اطلاعات اضافی، اطلاعات کپی رایت موضوع را اضافه کنید.

 

فایل style.css

body { text-align: center; }

#wrapper { display: block; border: 1px #a2a2a2 solid; width:90%; margin:0px auto; }

#header { border: 2px #a2a2a2 solid; }

#content { width: 75%; border: 2px #a2a2a2 solid; float: left; }

#sidebar { width: 23%; border: 2px #a2a2a2 solid; float: right; }

#delimiter { clear: both; }

#footer { border: 2px #a2a2a2 solid; }

.title { font-size: 11pt; font-family: verdana; font-weight: bold; }

این یک فایل CSS ساده است و نگاه ظاهری شما را تنظیم می کند.

فایل های فوق برخی از نمونه های فایل های قالب وردپرس هستند.

این یک موضوع اساسی است

و شما یک صفحه وب حاوی یک هدر، یک منطقه اصلی، یک نوار جانبی و یک پاورقی خواهید داشت.