دسته‌ها
وردپرس

آموزش طراحی قالب وردپرس #۴(هدر۱)

سری شماره ۴ آموزش طراحی قالب وردپرس (آموزش ساخت هدر و کدهای مربوط به آن)

سلام

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

صفحه ی لیست آموزشهای طراحی وردپرس

خوب لطفا wamp رو باز کنید و به صفحه ی تم amoozesh که دیروز ساختیم برید

C:\wamp\www\wordpress\wp-content\themes\amoozesh

امیدوارم تغییری در فایل index.php ایجاد نکرده باشین! اگه اینکار رو انجام دادین به نوشته شماره۳ رفته و کد رو با من یکی کنید.

توسط مرورگر وبی که استفاده میکنین (که امیدوارم اینترنت اکسپلورر نباشه!!!!) برین به صفحه اصلی سایت

http://localhost/wordpress/

پس الان ۳ تا صفحه باز داریم

فولدر تم آموزش

مرورگر وب در صفحه اصلی

و یک برنامه که یه آهنگ ملایم پخش میکنه!

همینطور که میبینید در صفحه سایتمون هیچی نیست!

خوب، میریم وارد index.php میشیم (با notepad) و بعد از تگ <body> نوشته ی زیر رو تایپ میکنیم!!

کپی نمیکنیم!!!!:-w

<?php bloginfo(’name’); ?>

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

هر تابع php در مقابل خودش () دارد که میتونه بینش آرگمان های مختلفی باشه یا اصلا نباشه!

bloginfo الان نام (name) سایت رو برمی گردونه(یعنی اسم سایت ما رو به html تبدیل میکنه که نمایش داده بشه)

خوب؟ دیگه بیشتر از این نمیشه توضیح داد!

حالا کلید Ctrl رورو نگه دارین و S رو بزنین تا کارمون ذخیره(save) بشه!

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

دیدین؟!!

ما در واقع الان با تابع bloginfo  نامی که در صفحه ی همگانی (general) تنظیمات (options) میتونیم عوض کنیم رو فراخوانی کردیم.

http://localhost/wordpress/wp-admin/options-general.php

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

کاری نداره! با استفاده از یک تگ XHTML این کار به راحتی انجام میشه!

بلافاصله قبل از شروع کدی که نوشتیم یعنی php?> کد زیر رو اضافه میکنیم:

<a href=”#”>

و بعد از <? هم این تگ رو که باز کردیم (یعنی تگ a رو) همونطوری که قبلا گفته بودم میبندیم یعنی یک / بهش اضافه میکنیم.

</a>

تا در مجموع داشته باشیم:

<a href=”#”><?php bloginfo(’name’); ?></a>

یادتون نره کپی نکنید چون اصلا کار نخواهد کرد! من هم دیگر تکرار نخواهم کرد این نکته رو!

میبینید که الان نوشته ی ما تبدیل به یک لینک شده که البته با کلیک بر روی اون کار خاصی انجام نمیشه! حالا اگه بخواهیم کار خاصی انجام بشه چی؟

این هم کاری نداره

برای اینکه لینک مارو به صفحه اصلی سایت ارجاع بده باید کد زیر رو جایگذین # بکنید.

<?php bloginfo(“url”); ?>

احتمالا فهمیدین چی شد!

آرگومان تابع bloginfo رو اینبار url انتخاب کردیم که آدرس سایت رو برمی گرداند!!

به همین راحتی

به همین …

امیدوارم ابهامی نباشه و بیشتر امیدوارم که ایرادی در توضیحاتم نبوده باشه هرچند فکر میکنم امکانش نیست!

موفق باشید

مواظب خودتون هم باشین، اگه شد!

24 دیدگاه دربارهٔ «آموزش طراحی قالب وردپرس #۴(هدر۱)»

salam.
agha dametgarm khoda kheiret bede.ma dar be dar donbale 1 amuzeshe khub budim.hala dg rahat shodim.man daram tamume matalebe siteto mikhunam.

be in migam 1 webe ghavi
kheili bahal bud
tnx
movafagh bashi

خب اینم از این این یکی رو خیلی جالب تر از درس قبلی توضیح دادین بازم ممنون
فعلا فکر می کنم برای امروز همین چند تا درسی رو که یاد گرفتم کافی باشه بعدا خدمت می رسیم و ما بقی آموزش رو هم می خونیم

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

سلام سیاوش جان، ادمایی که اطلاعاتشون رو در اختیار دیگران میذارن کمن اما ادمای دوس داشتنی هستند. زبون ساده ی شما به بجه ها کمک می کنه.

در قسمتی که گفتید این کد:

http://128.7.img98.net/out.php/i204381_in.png

برای ارجاع به صفجه اصلی استفاده بشه کارکتر دوطرف url اشتباه هست و باید اینجوری باشه:

http://128.7.img98.net/out.php/i204382_in2.png

اگر به صورت اول باشه به جای url به title ارجاع میشه.

*-:

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

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *