• نحوه ایجاد قالب در Word طرح بندی قالب وردپرس از طرح بندی HTML

    فرض کنید یک ارائه جدید و تا کنون خالی در پاورپوینت باز کردیم. و ما چه می بینیم؟

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

    و اسلاید اول در ارائه شما به طور خودکار همیشه بدون تلاش بیشتر به این شکل خواهد بود.


    قالب شامل:

    • رنگ ها
    • فونت ها
    • متغیرهایی (بخش هایی که متن، تصویر، نمودار و غیره را در آن درج می کنیم)

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

    1. ایجاد کنید فایل جدیددر پاورپوینت

    2. در را انتخاب کنید منوی بالادر تب Slide Master View.


    یک اسلاید مستر استاندارد در سمت چپ ظاهر می شود.

    این چیزی است که ما با آن کار خواهیم کرد. و ما یک غیر استاندارد خارج از استاندارد خواهیم ساخت.

    3. تم فونت مورد نظر را انتخاب کنید یا یک تم جدید ایجاد کنید.

    موضوع فونت فونت هایی است که در ارائه خود استفاده می کنید. باور کنید غیر از کالیبری خیلی های دیگر هم هستند فونت های خوب. آنها را فقط 1 بار مشخص کنید و به طور خودکار در کل ارائه یا الگو جایگزین می شوند.


    4. پس زمینه مورد نظر (رنگ یا الگو) را انتخاب کنید. می توانید یک پس زمینه یکسان را برای همه اسلایدها به طور همزمان یا برای یک اسلاید خاص انتخاب کنید.

    5. همانطور که می بینیم در سمت چپ گزینه های زیادی برای مکان متن، عنوان و ... وجود دارد. اما اگر به یکی نیاز داشته باشیم که وجود ندارد چه؟ مثلا داشتن 3 عکس با شرح.


    سپس تابع Insert Layout + Insert Placeholder به ما کمک خواهد کرد.

    پس از کلیک بر روی "Insert Layout" یک اسلاید خالی ایجاد می شود. و هر طور که بخواهیم می توانیم آن را پر کنیم.


    7. حالا اگر قرار باشد یک اسلاید جدید ایجاد کنیم، گزینه های قالب خود را می بینیم.

    8. ایجاد کنید ارائه جدیدو الگوی خود را "از دست داده اید"؟ به تب Design بروید و آن را در آنجا جستجو کنید.

    فقط به خاطر داشته باشید که وردپرس کلاس هایی تولید می کند که باید در شیوه نامه وجود داشته باشند. به عنوان مثال کلاس ها aligncenter، alignleft و alignrightبرای تراز کردن تصاویر و عناصر بلوک، و آنها باید در شیوه نامه شما گنجانده شوند (می توان از شیوه نامه طرح زمینه پیش فرض کپی کرد):


    aligncenter،
    div.aligncenter(
    display:block;
    حاشیه چپ: خودکار;
    margin-right: auto;
    }
    .تراز چپ(
    شناور به سمت چپ؛
    }
    .alignright(
    float:right;
    }

    کلاس‌های زیر برای تراز کردن تصاویری استفاده می‌شود که زیرنویس دارند (می‌توان از تم پیش‌فرض کپی کرد، در صورت لزوم بعداً تصحیح کرد):


    .wp-caption(
    حاشیه: 1px جامد #ddd;
    text-align: center;
    پس زمینه رنگ: #f3f3f3;
    صفحه بالشتک: 4 پیکسل
    حاشیه: 10 پیکسل
    /* پارامترهای اختیاری که ایجاد خواهد کرد گوشه های گرددر مرورگرهای پشتیبانی شده*/
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px.
    شعاع حاشیه: 3 پیکسل
    }
    .wp-caption img (
    حاشیه: 0;
    بالشتک: 0;
    حاشیه: 0
    }
    .wp-caption p.wp-caption-text (
    اندازه فونت: 11px;
    ارتفاع خط: 17 پیکسل؛
    padding: 0 4px 5px;
    حاشیه: 0;
    }

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


    .دسته بندی ها(...)
    cat-item /* این کلاس به همه دسته ها اختصاص داده شده است */)
    .current-cat (/* سبک دسته فعلی */)
    .current-cat-parent (/* سبک برای والد(های) دسته فعلی */)
    .children (/* کلاس برای کودک */)
    Pagenav. (/* پیمایش صفحه */)
    .page_item (/* هر مورد لیست */)
    .current_page_item (/* این کلاس در لیست صفحات به صفحه فعال فعلی تخصیص داده می شود */)
    .current_page_parent (/* کلاس برای صفحه اصلی صفحه فعلی */)
    .current_page_ancestor (/* هر صفحه سطوح بالادر رابطه با این */)
    .widget (/* همه ویجت ها در این کلاس پیچیده شده اند */)

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

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

    بنابراین، ما این را در هنگام طرح موضوع در نظر می گیریم.

    و آخرین چیزی که باید به style.css اضافه کنید اطلاعاتی در مورد خودتان و تم ایجاد شده است. اطلاعات در ابتدای فایل در نظرات قرار داده شده است:

    /*
    نام تم: با یک نام تم منحصر به فرد بیایید
    URI تم: http://theme-home-page-link
    توضیحات: شرح موضوع
    نویسنده: نویسنده موضوع
    URI نویسنده: http://link-to-author-page
    الگو: اجداد-موضوع-نام
    برچسب ها: برچسب های موضوع - فقط از لیست ارائه شده توسط wordpress.org
    نسخه: نسخه
    خب اینم متن مجوز
    */

    همچنین انجام آن را فراموش نکنید screenshot.pngو آن را در پوشه با قالب (در روت) قرار دهید. اطلاعاتی که به این صورت در استایل شیت قرار می گیرد در پنل مدیریت در قسمت نمایش داده می شود مدیریت "موضوعات". ما قالب ساخته شده را در مرورگرها آزمایش می کنیم، اگر همه چیز خوب است، می توانید ادامه دهید.

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

    تم wp چگونه کار می کند:

    اگر پوشه تم پیش فرض (wp-content/themes/default) را باز کنید، بسیاری از فایل های PHP (فایل های تم) و یک فایل style.css را مشاهده خواهید کرد. هنگامی که ما یک وبلاگ را مشاهده می کنیم، WP شامل فایل های موضوعی (index.php<

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

    مرحله 1:
    ابتدا در دایرکتوری قالب وردپرس (wp-content/themes) یک پوشه با نام موضوع خود ایجاد کنید. بگذار باشد ruseller_lessons. سپس از پوشه تم پیش فرض (wp-content/themes/default) فایل ها را کپی کنید comments.php, search.phpو 404.phpبه پوشه تم ما این فایل ها مسئول نظرات و جستجوهای وبلاگ هستند. سپس در ruseller_lessonsشیوه نامه را کپی کنید style.cssقالب ما screenshot.png (300x225)و پوشه تصاویر.

    اکنون فایل های قالب ما باید "کات" شوند، یعنی. پاورقی، نوار کناری و هدر را به فایل های جداگانه استخراج کنید. نمودار یک نمای ساده از فایل را نشان می دهد index.phpبا علامت هایی که بر اساس آن ها را برش می دهیم:

    گام 2 - header.php
    باز میکنیم index.htmlو قبل از کامنت همه چیز را قطع کنید، یک فایل جدید ایجاد کنید header.phpو کد برش را در آن قرار دهید، آن را در دایرکتوری موضوع ما ذخیره کنید ruseller_lessons:






    index.html






    حالا به پوشه ای با تم پیش فرض بروید، باز کنید header.phpو تگ ها را از آنجا کپی کنید , <link>, <h1>، و <div class=description> </b>و آنها را با خطوط مربوطه در ما جایگزین کنید <b>header.php</b>.</p> <p>سپس همه برچسب ها <li>واقع شده <b>id = "nav"</b>(فهرست صفحات در بالای وبلاگ) با یک تابع وردپرس جایگزین شده است</p> <p><b> <?php wp_list_pages("sort_column=menu_order&depth=1&title_li=");?> </b></p> <p>در نتیجه، دریافت می کنیم:</p><p> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br> <html xmlns="http://www.w3.org/1999/xhtml"><br> <head><br> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br> <title><?php wp_title("«", true, "right"); ?> <?php bloginfo("name"); ?>
    "type="text/css" media="screen" />
    " />





    مرحله 3 - Sidebar.php
    بیایید به فایل index.htm برگردیم. اول از همه، کل فرم جستجو را حذف می کنیم، سپس همه چیز را از آن برش می دهیم

    بیشتر بخوانید: