تبدیل قالب html به وردپرس به همراه آموزش گام به گام تصویری

تبدیل قالب html به وردپرس به همراه آموزش گام به گام تصویری

دسته‌بندی‌ها: آموزش وردپرس 7 خرداد 1404
0 رای
تبدیل قالب html به وردپرس

اگرچه فناوری وب راه درازی را پیموده است اما هنوز وب‌سایت‌هایی وجود دارند که صرفاً با HTML ایجاد شده‌اند. اگر شما صاحب یکی از آنها هستید، ممکن است برایتان جالب باشد که چگونه می‌توانید یک قالب HTML را به یک قالب وردپرس تبدیل کنید. خوشبختانه، اگر می‌خواهید آن فایل‌های HTML را به وردپرس تبدیل کنید، چندین گزینه در اختیار دارید. در این مقاله، چهار روش مختلف برای تبدیل قالب html به وردپرس را پوشش خواهیم داد. برای هر کدام دستورالعمل‌ها و منابعی را ارائه می‌دهیم که می‌تواند به شما کمک کند تا یک وب‌سایت مبتنی بر HTML را در وردپرس بیاورید.

روش های تبدیل قالب html به وردپرس

چند روش را برای تبدیل قالب اچ تی ام ال به یک قالب وردپرسی وجود دارد که در ادامه به بررسی آن‌ها می‌پردازیم:

روش اول: تبدیل HTML به قالب وردپرس به صورت دستی

اولین گزینه در مورد تبدیل، رویکرد دستی است. از آنجایی که این مسئله یک فرآیند کاملا عملی است، باید مطمئن شوید که به فایل‌های وب‌سایت اصلی و جدیدتان دسترسی دارید. به طور معمول، برای این منظور از یک برنامه پروتکل انتقال فایل امن (SFTP) استفاده می‌کنید. هنگامی که به وبسایت خود دسترسی پیدا کردید، می‌توانید مراحل زیر را انجام دهید.

مرحله 1: یک پوشه قالب ایجاد کنید

ابتدا باید یک پوشه ایجاد کنید تا فایل‌های قالب جدید خود را نگه داشته و آن را با نام قالب جدید خود تغییر دهید. با استفاده از ویرایشگر کد خود، می‌توانید پنج فایل مشخصی ایجاد کنید:

  • style.css
  • index.php
  • header.php
  • footer.php
  • sidebar.php

در حال حاضر، می‌توانید این فایل‌ها را خالی بگذارید و آنها را در پوشه‌ای که ایجاد کرده‌اید، ذخیره کنید.

مرحله 2: CSS موجود خود را کپی و جایگذاری کنید

اولویت بعدی شما سفارشی کردن فایل CSS است. این جایی است که شما تمام عناصر سی‌اس‌اس مختلف را برای سایت خود مشخص می‌کنید. در بالا، افزودن برخی اطلاعات در مورد فایل، تمرین خوبی است. در واقع، وقتی صحبت از وردپرس می‌شود، عناصری وجود دارند که برای نمایش موضوع در فهرست تم مورد نیاز هستند. در زیر این اطلاعات، باید کدهای CSS موجود را از وب‌سایت اصلی خود که می‌خواهید به موضوع جدید خود منتقل کنید، جای‌گذاری کنید.

/*
Theme Name:themes
Author: hamyarwp
Author URI: https://mywebsite.com
Description: ...
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

مرحله 3: HTML موجود را جدا کنید

در وبسایت اصلی شما، کد HTML که هدر، فوتر، سایدبار و قسمت‌های محتوای اصلی شما را مشخص می‌کند، احتمالاً در فایل index.html شما وجود دارند. اکنون، باید هر یک از آن عناصر را در فایل‌های جدیدی که برای قالب وردپرس خود ایجاد کرده‌اید، تقسیم کنید. به عنوان مثال، در فایل index.html وبسایت اصلی خود، می‌توانید اولین تگ <div> را با کلاس “main” پیدا کنید. هر چیزی که قبل از این تگ است را می‌توان کپی کرد و در فایل header.php جدید خود جایگذاری کرد.

سپس این فرآیند را برای تگ‌های «سایدبار» و «فوتر» تکرار خواهید کرد. کد موجود در هر یک از آن عناصر را کپی کرده و در فایل‌های PHP مربوطه قرار دهید. اکنون، آنچه برای شما باقی می‌ماند، بخش اصلی فایل index.html شماست. این همان چیزی است که طرح محتوای اصلی وبسایت مبتنی بر HTML شما را تشکیل می‌دهد. شما باید این کد باقیمانده را کپی کنید و آن را در فایل index.php جدید خود قرار دهید.


&amp;amp;lt;!doctype html&amp;amp;gt;
&amp;amp;lt;html&amp;amp;gt;
&amp;amp;lt;head&amp;amp;gt;
&amp;amp;lt;meta charset="utf-8"&amp;amp;gt;
&amp;amp;lt;title&amp;amp;gt;Test Site&amp;amp;lt;/title&amp;amp;gt;
&amp;amp;lt;meta name="description" content="Website description"&amp;amp;gt;
&amp;amp;lt;meta name="viewport" content="width=device-width, initial-scale=1"&amp;amp;gt;
&amp;amp;lt;link rel="stylesheet" href="style.css"&amp;amp;gt;
&amp;amp;lt;/head&amp;amp;gt;
&amp;amp;lt;body&amp;amp;gt;
&amp;amp;lt;div class="header-container"&amp;amp;gt;
&amp;amp;lt;header class="wrapper clearfix"&amp;amp;gt;
&amp;amp;lt;h1 class="title"&amp;amp;gt;Website Title&amp;amp;lt;/h1&amp;amp;gt;
&amp;amp;lt;nav&amp;amp;gt;
&amp;amp;lt;ul&amp;amp;gt;
&amp;amp;lt;li&amp;amp;gt;&amp;amp;lt;a href="#"&amp;amp;gt;menu item #1&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/li&amp;amp;gt;
&amp;amp;lt;li&amp;amp;gt;&amp;amp;lt;a href="#"&amp;amp;gt;menu item #2&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/li&amp;amp;gt;
&amp;amp;lt;li&amp;amp;gt;&amp;amp;lt;a href="#"&amp;amp;gt;menu item #3&amp;amp;lt;/a&amp;amp;gt;&amp;amp;lt;/li&amp;amp;gt;
&amp;amp;lt;/ul&amp;amp;gt;
&amp;amp;lt;/nav&amp;amp;gt;
&amp;amp;lt;/header&amp;amp;gt;
&amp;amp;lt;/div&amp;amp;gt;
&amp;amp;lt;div class="main-container"&amp;amp;gt;
&amp;amp;lt;main class="main wrapper clearfix"&amp;amp;gt;
&amp;amp;lt;article&amp;amp;gt;
&amp;amp;lt;header class="entry-header"&amp;amp;gt;
&amp;amp;lt;h2 class="entry-title"&amp;amp;gt;Article&amp;amp;lt;/h2&amp;amp;gt;
&amp;amp;lt;/header&amp;amp;gt;
&amp;amp;lt;p&amp;amp;gt;Test text right here..&amp;amp;lt;/p&amp;amp;gt;
&amp;amp;lt;h2&amp;amp;gt;Subheading&amp;amp;lt;/h2&amp;amp;gt;
&amp;amp;lt;p&amp;amp;gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. &amp;amp;lt;/p&amp;amp;gt;
&amp;amp;lt;h2&amp;amp;gt;A Sub&amp;amp;lt;/h2&amp;amp;gt;
&amp;amp;lt;p&amp;amp;gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. &amp;amp;lt;/p&amp;amp;gt;
&amp;amp;lt;/article&amp;amp;gt;
&amp;amp;lt;aside&amp;amp;gt;
&amp;amp;lt;h3&amp;amp;gt;Sidebar here&amp;amp;lt;/h3&amp;amp;gt;
&amp;amp;lt;p&amp;amp;gt;Etiam ullamcorper lorem dapibus velit suscipit ultrices. &amp;amp;lt;/p&amp;amp;gt;
&amp;amp;lt;/aside&amp;amp;gt;
&amp;amp;lt;/main&amp;amp;gt; &amp;amp;lt;!-- #main --&amp;amp;gt;
&amp;amp;lt;/div&amp;amp;gt; &amp;amp;lt;!-- #main-container --&amp;amp;gt;
&amp;amp;lt;div class="footer-container"&amp;amp;gt;
&amp;amp;lt;footer class="wrapper"&amp;amp;gt;
&amp;amp;lt;p class="footer-credits"&amp;amp;gt;© 2024 My Test Site&amp;amp;lt;/p&amp;amp;gt;
&amp;amp;lt;/footer&amp;amp;gt;
&amp;amp;lt;/div&amp;amp;gt;
&amp;amp;lt;/body&amp;amp;gt;
&amp;amp;lt;/html&amp;amp;gt;

همانطور که می‌بینید، این یک قالب HTML استاندارد است که شامل یک هدر، یک سایدبار و یک فوتر می‌شود. اگر طراحی شما متفاوت است، ممکن است لازم باشد مراحل را کمی تغییر دهید. با این حال، روند اصلی یکسان خواهد بود. برای ادامه کار روی قالب خود، فایل index.html را که فایل اصلی وب‌سایت HTML شماست، باز کنید. سپس، به فایل‌های وردپرسی که ایجاد کرده‌اید نگاهی بیندازید و کد زیر را در آنها کپی کنید.

فایل Header.php

هر چیزی که در فایل HTML شما از قسمت محتوای اصلی <main> یا <div class=”main”> وجود دارد، به فایل header.php می‌رود. کد را با بستن </head> و کپی کردن <?php wp_head();?> به پایان برسانید. این برای عملکرد صحیح بسیاری از افزونه‌های وردپرس مهم است.


&lt;!doctype html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset="utf-8"&gt;
&lt;title&gt;Website Title&lt;/title&gt;
&lt;meta name="description" content="Website description"&gt;
&lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
&lt;link rel="stylesheet" href="style.css"&gt;
&lt;?php wp_head();?&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div class="header-container"&gt;
&lt;header class="wrapper clearfix"&gt;
&lt;h1 class="title"&gt;Website Title&lt;/h1&gt;
&lt;nav&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#"&gt;nav item #1&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#"&gt;nav item #2&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#"&gt;nav item #3&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/nav&gt;
&lt;/header&gt;
&lt;/div&gt;
&lt;div class="main-container"&gt;
&lt;main class="main wrapper clearfix"&gt;

ساخت فایل Sidebar.php

تمام محتوای داخل بخش <aside> باید در این فایل وردپرس قرار گیرد:


&lt;aside&gt;
&lt;h3&gt;Sidebar&lt;/h3&gt;
&lt;wp-p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam sodales urna non odio egestas tempor. Nunc vel vehicula ante. Etiam bibendum iaculis libero, eget molestie nisl pharetra in. In semper consequat est, eu porta velit mollis nec. Curabitur posuere enim eget turpis feugiat tempor. Etiam ullamcorper lorem dapibus velit suscipit ultrices.&lt;/wp-p&gt;
&lt;/aside&gt;

ساخت فایل Footer.php

مرحله آخر اضافه کردن اطلاعات پاورقی از انتهای نوار کناری به انتهای فایل است. پس از آن، <?php wp_footer();?> را درست قبل از تگ </body> وارد کنید، مشابه نحوه اضافه کردن wp_head در هدر.


&lt;/main&gt; &lt;!-- #main --&gt;
&lt;/div&gt; &lt;!-- #main-container --&gt;
&lt;div class="footer-container"&gt;
&lt;footer class="wrapper"&gt;
&lt;wp-p class="footer-credits"&gt;© 2019 My Imaginary Website&lt;/wp-p&gt;
&lt;/footer&gt;
&lt;/div&gt;
&lt;?php wp_footer();?&gt;
&lt;/body&gt;
&lt;/html&gt;

مرحله 4: فایل Index.php خود را پیکربندی کنید

قدم بعدی شما این است که مطمئن شوید فایل فهرست جدید شما می‌تواند فایل‌های لازم برای فعال کردن قالب را برای نمایش ساختار و سبک سایت پیدا کند. برای رسیدن به این هدف، از برچسب‌های قالب وردپرس استفاده خواهید کرد. از این‌ها برای بازیابی فایل‌های هدر، فوتر و سایدبار به قالب استفاده می‌شود. به عنوان مثال، می‌توانید قالب خود را با استفاده از تگ زیر، فایل هدری را که ایجاد کرده‌اید نمایش دهد:

&lt;/wp-p&gt;
&lt;link rel="stylesheet" href="&lt;?php echo get_template_directory_uri(); ?&gt;/style.css" type="text/css" media="all" /&gt;

شما این کد را در فایل قالب index.php خود یا در صفحات بعدی که می‌خواهید هدر نمایش داده شود، قرار دهید. همین امر در مورد فوتر شما نیز صدق می‌کند. بخش مهم دیگری از قالب جدید شما وجود دارد که باید آن را نیز درک کنید. این حلقه وردپرس نامیده می‌شود – قطعه‌ای از کد PHP که به قالب می‌گوید پست‌ها را وارد کند. همچنین می‌توان آن را برای کنترل تعداد پست‌های نمایش داده شده سفارشی کرد.


&lt;?php get_header(); ?&gt;
&lt;?php while ( have_posts() ) : the_post(); ?&gt;
&lt;article class="&lt;?php post_class(); ?&gt;" id="post-&lt;?php the_ID(); ?&gt;"&gt;
&lt;h2 class="entry-title"&gt;&lt;?php the_title(); ?&gt;&lt;/h2&gt;
&lt;?php if ( !is_page() ):?&gt;
&lt;section class="entry-meta"&gt;
&lt;wp-p&gt;Posted on &lt;?php the_date();?&gt; by &lt;?php the_author();?&gt;&lt;/wp-p&gt;
&lt;/section&gt;
&lt;?php endif; ?&gt;
&lt;section class="entry-content"&gt;
&lt;?php the_content(); ?&gt;
&lt;/section&gt;
&lt;section class="entry-meta"&gt;&lt;?php if ( count( get_the_category() ) ) : ?&gt;
&lt;span class="category-links"&gt;
Posted under: &lt;?php echo get_the_category_list( ', ' ); ?&gt;
&lt;/span&gt;
&lt;?php endif; ?&gt;&lt;/section&gt;
&lt;/article&gt;
&lt;?php endwhile; ?&gt;
&lt;?php get_sidebar(); ?&gt;
&lt;?php get_footer(); ?&gt;

مرحله 5: قالب جدید خود را آپلود کنید

اکنون که قالب جدید شما آماده عمل است، باید پوشه آن را در پوشه wp-themes/content/ وبسایت خود قرار دهید:
پس از آپلود فایل‌ها، می‌توانید وارد داشبورد وردپرس خود شوید و به نمایش > قالب‌ها بروید. در اینجا، باید قالب جدید خود را در لیست مشاهده کنید و بتوانید روی فعال کلیک کنید و شروع به استفاده از آن کنید.

ایجاد اسکرین شات در قالب

برای ایجاد اسکرین‌شات برای قالب خود، وب‌سایت خود را در مرورگر باز کنید و از آن اسکرین‌شات بگیرید. تصویر را به ابعاد ۸۸۰×۶۶۰ پیکسل برش دهید و آن را با نام screenshot.png ذخیره کنید. سپس، این اسکرین‌شات را در پوشه قالب خود قرار دهید. اکنون می‌توانید قالب جدید وردپرس خود را به دو روش آپلود کنید.
روش اول استفاده از FTP برای کشیدن مستقیم فایل‌های قالب به پوشه wp-content/themes است. برای این کار نیازی به فشرده‌سازی فایل‌ها به فرمت zip نیست. کافیست از یک کلاینت FTP مانند FileZilla برای انتقال پوشه به پوشه wp-content/themes استفاده کنید.
برای آپلود قالب خود، ابتدا کل پوشه قالب را در یک فایل zip فشرده کنید. سپس، در داشبورد وردپرس خود به نمایش → قالب‌ها بروید.

افزودن قالب

حتما بخوانید: چگونه در وردپرس متن را به گفتار تبدیل کنیم؟

روش دوم: وارد کردن محتوای HTML به قالب وردپرس با یک افزونه

برای وارد کردن وب‌سایت HTML خود به وردپرس، ساده‌ترین روش این است:

  • نصب افزونه‌ی وارد کردن

اولین قدم نصب افزونه‌ HTML Import 2 نوشته‌ی استفانی لیری است.
ساده‌ترین راه برای انجام این کار، رفتن به بخش افزونه‌ها → افزودن جدید در داشبورد وردپرس و جستجوی افزونه بر اساس نام آن است. روی «نصب کن» کلیک کنید. پس از اتمام نصب، افزونه را فعال کنید.
این افزونه ممکن است با آخرین نسخه‌های وردپرس سازگار نباشد. مدتی است که به‌روزرسانی نشده است.

  • مسیری را که فایل‌های موجود خود را در آن کپی کرده‌اید، وارد کنید.
  • برای تغییر مسیرها، آدرس اینترنتی قدیمی خود را وارد کنید.
  • فایل پیش‌فرض برای دایرکتوری‌های سایت قدیمی، معمولاً index.html، را مشخص کنید.
  • پسوند فایل‌های محتوایی را که می‌خواهید وارد کنید، وارد کنید.
  • اگر دایرکتوری‌هایی از سایت قدیمی وجود دارد که نمی‌خواهید وارد کنید، آنها را اینجا فهرست کنید.
  • برای اینکه افزونه به طور خودکار از نام فایل‌های شما به عنوان آدرس‌های اینترنتی جدید استفاده کند، کادر مربوطه را علامت بزنید.
  • این مورد در صورتی مفید است که عناوین شما طولانی باشند، زیرا واردکننده معمولاً از آنها برای ایجاد slug استفاده می‌کند.
  فعال‌سازی و غیرفعال‌سازی نمایش خطا PHP در وردپرس

درون ریزی اچ تی ام ال با افزونه

برای تنظیم این مورد، گزینه تگ HTML را در بالا انتخاب کنید. سپس، تگ را در سه فیلد زیر پیکربندی کنید:
اگر محتوای شما درون تگی مانند <div id=”main”> قرار دارد، در فیلد اول div، در فیلد دوم id و در فیلد سوم main را وارد کنید.

بخش محتوای افزونه

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

  • با مشخص کردن نحوه علامت‌گذاری عناوین در قالب HTML خود شروع کنید تا افزونه بتواند آنها را به درستی وارد کند.
  • همچنین می‌توانید عناصر غیرضروری مانند عنوان سایت را که اغلب به طور پیش‌فرض در قالب‌های وردپرس گنجانده شده است، فیلتر کنید.
  • در صورتی که عناوین در محتوا باشند، می‌توانید به واردکننده دستور دهید که آنها را حذف کند تا از تکرار جلوگیری شود.
  • تنظیمات باقی مانده به شما امکان می‌دهد گزینه‌های وردپرس را برای صفحات جدید پیکربندی کنید.

تایتل و تنظیمات متادیتا

اگر داده‌ای برای اضافه کردن به فیلدهای سفارشی دارید، می‌توانید آن را در اینجا تنظیم کنید.

کاستوم فیلد

در اینجا می‌توانید دسته‌ها، برچسب‌ها و انواع محتوایی را که وارد کرده‌اید انتخاب کنید. افزونه، طبقه‌بندی‌های موجود در سایت شما را نمایش می‌دهد تا این فرآیند را ساده‌تر کند.

دسته ها و برچسب ها

این صفحه تعدادی از ابزارهای مفید برای وارد کردن موفقیت‌آمیز از HTML به وردپرس را فهرست می‌کند.

ابزارهای افزونه

شروع درون ریزی HTML با افزونه

پس از اتمام پیکربندی، تنظیمات را ذخیره کنید. روی دکمه‌ی «وارد کردن فایل‌ها یا Import Files» کلیک کنید. در مرحله‌ی بعد، انتخاب کنید که آیا می‌خواهید یک دایرکتوری از فایل‌ها را وارد کنید یا یک فایل واحد که باید آن را مرور کنید، سپس روی ارسال کلیک کنید.

درون ریزی اطلاعات اچ تی ام ال

و کار تمام است!
پس از تنظیم همه چیز، سایت وردپرس شما باید تمام محتوای موجود که توسط قالب جدید قالب‌بندی شده است را نمایش دهد.

حتما بخوانید: نحوه تبدیل پست‌های ویرایشگر کلاسیک به گوتنبرگ

روش سوم: وارد کردن HTML به وردپرس با استفاده از چایلد تم

راه دیگری برای انتقال سایت HTML خود به وردپرس استفاده از یک چایلد تم است. این همان عملکرد و سبک پایه قالب اصلی خود را دارد، اما می‌توانید هر گونه ترفند و سفارشی‌سازی را که انجام می‌دهید، حتی اگر والد را به‌روزرسانی کنید. در ادامه روش انجام آن را بررسی می‌کنیم:

مرحله 1: یک قالب را انتخاب کنید

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

مرحله 2: یک پوشه برای تم چایلد خود ایجاد کنید

در مرحله بعد، باید با یک برنامه FTP به فایل‌های خود دسترسی داشته باشید و یک پوشه جدید در فهرست
wp-content/themes خود ایجاد کنید. این فایل باید همان نام قالب والد شما باشد و “-child” به انتهای آن اضافه شود. به عنوان مثال، اگر می‌خواهید یک تم چایلد برای Twenty Nineteen ایجاد کنید، می‌توانید پوشه‌ای به نام twentynene-child ایجاد کنید. این تنظیم به این معنی است که تم چایلد شما می‌تواند به‌طور خودکار توابع و سبک‌ها را از قالب والد بیرون بکشد البته پس از تنظیم بقیه فایل‌های قالب ضروری.

مرحله 3: یک برگه سی‌اس‌اس تنظیم کنید

قدم بعدی شما تنظیم فایل style.css خواهد بود. وردپرس به اطلاعات خاصی در شیوه نامه نیاز دارد تا در رابطه قالب والد-فرزند کار کند. همچنین می‌توانید در صورت نیاز، اطلاعات سی‌اس‌اس را از فایل‌های HTML اصلی خود دریافت کنید.


/*
Theme Name: inshal-wordpress-theme-child
Theme URI: http://example.com/inshal-wordpress-theme-child/
Description: inshal-wordpress-theme Child Theme
Author: WPZOOM
Author URI: http://example.com
Template: inshal-wordpress-theme
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/

مرحله 4: یک فایل Function.php را تنظیم کنید

اکنون که اساساً دو قالب دارید که با آنها کار می‌کنید، باید به وردپرس بگویید که تم چایلد شما به CSS والد بستگی دارد. برای آن، می‌توانید از فراخوانی PHP ()wp_enqueue_style استفاده کنید. ابتدا یک فایل function.php ایجاد می‌کنید و آن را در پوشه تم چایلد قرار می‌دهید. این فایلی است که در آن تابع صف را اجرا می‌کنید که وابستگی‌ها و سلسله مراتب تم را مشخص می‌کند.


/*
Theme Name: inshal-wordpress-theme-child
Theme URI: http://example.com/inshal-wordpress-theme-child/
Description: inshal-wordpress-theme Child Theme
Author: WPZOOM
Author URI: http://example.com
Template: inshal-wordpress-theme
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/

مرحله 5: قالب چایلد خود را فعال کنید

هنگامی که این فایل‌های جدید را در سرور وب سایت خود آپلود کردید، می‌توانید به داشبورد وردپرس خود برگردید و به نمایش> قالب‌ها بروید. حالا باید تم چایلد را کاملاً آماده ببینید. روی فعال‌سازی روی قالب چایلد کلیک کنید تا آن را به عنوان قالب وبسایت خود تنظیم کنید. سپس شما آماده هستید تا محتوای وبسایت HTML خود را در سایت جدید وردپرس خود کپی کنید.

مرحله 6: طراحی خود را تنظیم کنید

برای ایجاد یک سایت وردپرس که شبیه وب‌سایت HTML اصلی شما باشد، مرحله آخر انتقال دستی محتوای HTML به وردپرس است. اگرچه افزونه‌هایی وجود دارند که می‌توانند این کار را خودکار کنند، اما ممکن است با آخرین نسخه‌های وردپرس کار نکنند. بنابراین، انجام دستی این کار ایمن‌تر است.

چرا قالب html را به وردپرس تبدیل کنیم؟

مسلما قالب‌هایی که با اچ تی ام ال کدنویسی می‌شوند، بصورت یک سایت ایستا هستند که برای هر تغییری نیازمند دستکاری در کد دارند. این فرآیند برای افراد مخصوصا افرادی که آشنایی با کد ندارند امر سختی بوده و زمانبر است. در نتیجه برای مدیریت آسان و دقیق یک سایت ما نیازمند یک پنل مدیریتی کاربرپسند هستیم که این امکان را وردپرس به ما می‌دهد. ما با تبدیل قالب اچ تی ام ال به وردپرس، یک سایت ایستا را به پویا یا همان داینامیک تبدیل می‌کنیم.

نکات مهم هنگام انتقال قالب

نکاتی در این بین هستند که برای انتقال قالب اچ تی ام ال به وردپرس به آن‌ها نیاز داریم. این نکات عبارت است از:

  • انتخاب هاستی که از وردپرس و دیتای موردنیاز ما پشتیبانی کند. معمولا هاست وردپرس یا هاست لینوکسی گزینه مناسب و استانداردی است که باید برای سایت تهیه شود.
  • در ادامه نیازمند ویرایشگر کد هستیم تا بتوانیم با کدهای اچ تی ام ال ارتباط برقرار کرده و تبدیل انجام دهیم. این ویرایشگر می‌تواند notepad++ باشد.
  • به سرمایه برای خرید هاست و شاید کمک گرفتن از یک برنامه نویس احتیاج داشته باشید. همه افراد امکان یادگیری و انتقال را ندارند و ترجیح می‌دهند از یک شخص ماهر کمک بگیرند. اما اگر به این مسئله علاقه‌مند هستید پیشنهاد می‌کنیم خودتان بیاموزید و انجام دهید.

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

  • وردپرس اوپن سورس، داینامیک و بسیار منعطف است پس امکان تغییرات ظاهری و زیرساختی را به راحتی به ما خواهد داد.
  • با انتقال، می‌توانید برای امکانات بیشتر از افزونه‌های وردپرسی کمک بگیرید.
  • امکان ایجاد صفحات گرافیکی و استاندارد را خواهید داشت.
  • امکان بروزرسانی و ارتقا وجود دارد.
  • عملکرد شما بسیار آسان خواهد شد.
  • امنیت سایت را افزایش خواهید داد.

جمع بندی

برخی از سایت‌ها قالب‌های ایستای HTML دارند و یکباره تصمیم می‌گیرند آن را به یک سایت وردپرسی تبدیل کنند. چنین مسئله‌ای کاملا عملی و امکان‌پذیر است. در این مقاله ما به 4 روش عملی و کاربردی برای تبدیل قالب html به وردپرس برای شما معرفی کردیم، تمامی 4 مرحله عنوان شده در این مقاله به صورت گام به گام توضیح داده شده است، اگر در حین انام مراحل سوالی داشتید می‌توانید آن‌را در بخش نظرات برای ما ارسال کنید، کارشناسان همیاروردپرس در اسرع وقت به سوال شما جواب می‌دهند. قالب‌های وردپرسی، ترکیبی از html و css هستند، همیاروردپرس مرجع ارائه قالب‌های رایگان وردپرس در ایران است تا بتوانید بدون صرف هزینه و تنها با پیروی از دستورالعمل‌ها به راحتی قالب رایگان وردپرسی مخصوص وب‌سایت خودتان را دانلود کنید.

آیا این مقاله برای شما مفید بود؟
تقریبا
خیر
12 سال عضو همیار وردپرس
آموختن کوچک‌ترین رسالتی است که بر دوش انسان‌هاست. من نیز خود را در انجام درست این رسالت شریک می‌دانم.

دیدگاهتان را بنویسید

ارسال دیدگاه به معنی این است که شما ابتدا قوانین ارسال دیدگاه را مطالعه کرده‌اید و با آن موافق هستید.