بنابراین، شما به آمار اخیر نگاه کرده اید، گفت که وردپرس در حال حاضر 33 درصد از وب سایت های اینترنتی را در اینترنت فعال می کند. به عنوان یک صاحب وبسایت، ممکن است در نظر بگیرید که سایت HTML خود را به WordPress تبدیل کنید.
در حالی که هنوز وب سایت مبتنی بر HTML را به عنوان یک HTML5 خوب می داند، مخصوصا برای سایت ویترین. اما برای همه چیز، وردپرس راه حل های راحت تر را فراهم می کند. وردپرس بسیاری از تم ها، پلاگین ها و ویدجت ها را برای بهبود وب سایت و اضافه کردن ویژگی های مفید ارائه می دهد.
همچنین مدیریت آسان است. شما می توانید بدون کد گذاری مطالب را اضافه و حذف کنید. با یک سایت HTML، این یک داستان متفاوت است. به استثنای اینکه شما می دانید که کد چگونه است، به روز رسانی محتوا با HTML می تواند دشوار باشد.
در این مقاله، شما نحوه تبدیل HTML استاتیک به وردپرس و روش های مختلف برای انجام آن را یاد خواهید گرفت. بیایید شروع کنیم.
چیزهایی که هنگام حرکت باید مراقب باشند
قبل از رفتن، باید چند چیز را در نظر بگیرید.
خدمات میزبانی وب قبل از شروع باید یک برنامه میزبانی داشته باشید، زیرا الزامات ممکن است از یک سایت HTML متفاوت باشد. شما برای میزبانی سایت وردپرس خود نیاز دارید. همچنین شما می توانید وب سایت خود را به صورت محلی میزبان خود قرار دهید و بعدا آن را زنده نگه دارید.
ویرایشگر کد. برای کد نویسی وب سایت خود، یک ویرایشگر کد مانند Notepad ++، Atom، Sublime و غیره نیاز دارید.
زمان و پول شما باید زمان و پولی که مایل به سرمایه گذاری هستید را در نظر بگیرید. اگر شما آماده و متعهد به یادگیری هستید، این آموزش برای شما مناسب است. به علاوه، شما همچنین می توانید از توسعه دهندگان یا استخدام برنامه های مهاجرت برای کمک به تبدیل استفاده کنید. استخدام شخص بسیار ساده تر است، اما فرصت یادگیری را از دست خواهید داد و روند ممکن است گران باشد.
راه های مختلف برای تبدیل HTML به وردپرس
روش های متعددی برای تبدیل HTML به وردپرس وجود دارد و آنها با سطوح دشواری های مختلف می آیند. آنها به شرح زیر هستند:
ایجاد یک تم وردپرس از یک سایت HTML استاتیک. اگر شما طرح وب سایت قدیمی HTML خود را ناسازگار، این گزینه برای شما مناسب است. این نیز مسیر به چالش کشیدن است و نیاز به برنامه نویسی دارد. اما نترسید همه چیزهایی که باید انجام دهید این است که کد HTML قدیمی را به چند فایل پی اچ پی تبدیل کنید.
از دست دادن طراحی و حفظ محتوای تنها اگر شما با پشت سر گذاشتن طراحی وب سایت قدیمی خود و پیدا کردن یک تم وردپرس برای شروع تازه است، این گزینه برای شما مناسب است. شما فقط نیاز به انتقال محتوا به خانه جدید خود دارید.
استفاده از موضوع کودک که از یک موضوع موجود اقتباس شده است. این احتمالا ساده ترین مسیر است اگر می خواهید طراحی وب سایت قدیمی را حفظ کنید. با استفاده از این روش، شما از یک موضوع وردپرس از قبل موجود استفاده می کنید و از آن استفاده می کنید. به عنوان یک پاداش، شما می توانید از ویژگی های قدرتمند وردپرس استفاده کنید.
1. ایجاد پوشه تم و فایل های اساسی
یک پوشه تم جدید بر روی دسکتاپ خود ایجاد کنید و آن را نام ببرید. ما پوشه ما را به عنوان تم من نامگذاری می کنیم. پس از آن، ویرایشگر کد خود را باز کرده و فایل های زیر را ایجاد کنید:
style.css
index.php
header.php
sidebar.php
footer.php
ویرایشگر را باز کنید ما قصد داریم بعدا دوباره به آن برگردیم.
2. تغییر سایز وب سایت قدیمی به ورق سبک وردپرس
اکنون ما قصد داریم یک ورق سبک وردپرس را با کپی کردن کد قدیمی CSS خود به آن، ایجاد کنیم. به فایل style.css بروید و این کد را وارد کنید:
بعد از این بخش به سادگی CSS موجود خود را در زیر وارد کنید. ذخیره کنید و فایل را ببندید.
مرحله 3: HTML فعلی خود را جدا کنید
قبل از اینکه به مرحله سه برسیم، اجازه بدهید یک یادداشت سریع در مورد اینکه چگونه وردپرس کار می کند را به شما بدهم. وردپرس با استفاده از پی اچ پی برای فراخوانی و بازیابی تکه های داده از پایگاه داده زیربنایی خود استفاده می کند. هر فایل که ما در این آموزش کوچک استفاده می کنیم، طراحی شده است تا به وردپرس بگوییم کدام بخش از محتوای سایت شما نمایش داده می شود و کجا.
بنابراین، هنگامی که می گویم، ما "HTML" را خرد کنیم، آنچه که ما واقعا انجام می دهیم، ساده کردن بخش هایی از کد فعلی شما در فایل های مختلفی است که ما تازه ساخته ایم، به طوری که WordPress می داند کجا نمایش داده شود آنها
اینجا برویم
ابتدا فایل index.html سایت سایت خود را باز کنید. همه چیز را از بالای فایل به کلاس باز div class = "main" تگ کنید. این قسمت را در فایل header.php خود ذخیره و بسته کنید و آن را کپی کنید.
دوم، به فایل index.html خود بروید. عنصر class = "sidebar" را کنار بگذارید و همه چیز در داخل آن باشد. این بخش را به فایل sidebar.php خود کپی و قرار دهید، ذخیره کنید و بستن.
سوم، در index.html شما همه چیز را بعد از نوار کناری خود انتخاب کنید و کپی کنید و آن را در فایل footer.php خود قرار دهید، ذخیره کنید و بستن.
در نهایت، در فایل index.html شما، همه چیز را که سمت چپ است، انتخاب کنید (این باید بخش محتوای اصلی باشد) و آن را در فایل index.php خود قرار دهید. ذخیره، اما هنوز نزدیک نیست
شما هم اکنون می توانید فایل index.html خود را بسته و به مراحل نهایی بروید. تقریبا انجام شده!
مرحله 4: فایل index.php شما را نهایی کنید
برای تکمیل فایل index.php تم جدید خود باید مطمئن شوید که می توانید از بخش دیگری (علاوه بر محتوای اصلی) که در سایر فایل هایی که ایجاد کرده اید، تماس بگیرید. یا به عبارت دیگر، عناصری را که "خرد شده" شده اند کنار بگذاریم.
در بالای فایل index.php خود، خط زیر PHP را قرار دهید.
<؟ php get_header ()؛ ؟>
سپس، در پایین فایل index.php خود، این خطوط پی اچ پی قرار دهید.
<؟ php get_sidebar ()؛ ؟>
<؟ php get_footer ()؛ ؟>
و در نهایت، ما باید آنچه را که حلقه نامیده می شود اضافه کنیم. این بیت اصلی پیپ است که وردپرس برای نمایش محتوای پست خود به بازدیدکنندگان استفاده می کند. بنابراین گام نهایی در ایجاد فایل index.php تم جدید شما اضافه کردن کد زیر در بخش محتوای است.
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="post-header">
<div class="date"><?php the_time( 'M j y' ); ?></div>
<h2><a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<div class="author"><?php the_author(); ?></div>
</div><!--end post header-->
<div class="entry clear">
<?php if ( function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?>
<?php the_content(); ?>
<?php edit_post_link(); ?>
<?php wp_link_pages(); ?> </div>
<!--end entry-->
<div class="post-footer">
<div class="comments"><?php comments_popup_link( 'Leave a Comment', '1 Comment', '% Comments' ); ?></div>
</div><!--end post footer-->
</div><!--end post-->
<?php endwhile; /* rewind or continue if all posts have been fetched */ ?>
<div class="navigation index">
<div class="alignleft"><?php next_posts_link( 'Older Entries' ); ?></div>
<div class="alignright"><?php previous_posts_link( 'Newer Entries' ); ?></div>
</div><!--end navigation-->
<?php else : ?>
<?php endif; ?>
index.php را ذخیره و بستن شما موضوع را به پایان رسانده اید! همه چیز آن است که آن را به وب سایت وردپرس خود آپلود کنید.
مرحله 5: تم جدید خود را آپلود کنید
حالا که فایل های تم خود را ایجاد کرده اید و همه آنها را در پوشه تم جدید خود ذخیره کرده اید، باید به دایرکتوری جدید وردپرس خود دسترسی پیدا کنید.
پوشه تم جدید خود را در داخل / wp-content / themes / قرار دهید. سپس به WP Admin> Appearance> Themes ها بروید و موضوع تازه ایجاد شده شما باید در آنجا ظاهر شود. برو جلو و فعال کن
همه چیزهایی که باید در این مرحله انجام داد، وب سایت جدید وردپرس شما با محتوای سایت قدیمی شما است. در ادامه با بخش زیر (پیگیری قسمت مربوط به استفاده از تم پیش ساخته شده) را دنبال کنید تا ببینید که چطور انجام شود.
با استفاده از پیش ساخته وردپرس و وارد کردن محتوای HTML
اگر گام های فوق به نظر می رسد بیش از حد فشرده یا وقت گیر برای شما پس مطمئن باشید، راه دیگری وجود دارد. به جای تبدیل هر گونه طراحی شما اتفاق می افتد به کار در حال حاضر به یک موضوع وردپرس، شما می توانید از هر یک از هزاران تم در دسترس در بازار وردپرس گسترده تر استفاده کنید.
تم های رایگان وجود دارد و تم های حقوقی وجود دارد. قبل از تصمیم گیری که برای شما بهترین است، شما ممکن است بخواهید که در مورد موضوعاتی طراحی شده که نیازهای شما را برآورده کنند و از طریق موضوعی در اینجا در تم های زیبا و جاهای دیگر فهرست کنید.
پس از انتخاب یک تم که دوست دارید (و بسته فایل فایل زیپ خود را دانلود کرده اید)، می خواهید به WP Admin> Appearance> Themes> Add New بروید و تم جدید WordPress خود را نصب / فعال کنید.
هنگامی که این کار انجام می شود، شما یک وب سایت وردپرس جدید و تم را خواهید داشت، اما کمی بیشتر. هنگامی که سایت خود را پیش نمایش می کنید، از محتویات خالی است و احتمالا خسته کننده است. خوب، چون بعدا می خواهیم محتوای سایت قدیمی خودمان را وارد کنیم.
در WP Admin به Plugins> Add New بروید و پلاگین ای را به نام HTML Import 2 توسط Stephanie Leary جستجو کنید. هنگامی که این پلاگین نصب و فعال می شود، راهنمای کامل دستی خود را برای وارد کردن کل دایرکتوری صفحات HTML دنبال کنید. کامل با تصاویر!
پس از این همه محتوای قدیمی خود را در وردپرس زندگی می کنید و با تم جدید خود قالب بندی می کنید. یا اگر شما تم خود را در بالا ایجاد کردید، سایت شما باید بسیار شبیه قبل از آن باشد که فقط در WordPress اجرا شود.
در نتیجه
اگر از این پست به عنوان یک راهنما برای مهاجرت وب سایت خود به WordPress استفاده کرده اید، سپس به یکی از بزرگترین جوامع منبع باز در جهان پیوستید. خوش آمدی! این مکان سرگرم کننده با بسیاری از توسعه دهندگان، طراحان، وبلاگ نویسان، DIYers، و بیشتر - همه ساخت، بازی و ایجاد با تم و افزونه های وردپرس و وردپرس است.
اگر "اشکال وردپرس را گرفتی"، وبسایت رسمی WordPress.org پر از تم ها، پلاگین ها و سایر منابع مفید است. اگر میخواهید فایلهای تم خود را نیشگون بگیرید، Codex را برای راهنماییها، ترفندها و تغییرات به ظاهر بیپایان مطالعه کنید.
و البته ما امیدواریم که در مورد نظرات چپ گپ بزنید و برای پست های بیشتر وبلاگ در آینده اشتراک کنید.
منبع : تبدیل html به وردپرس