ساخت منوی کشویی در وردپرس و سایت ها
برای اولین پست برای وب سایت آموزش قرار دادن هیدر(هدر) کشویی یا هیدر آبشاری drop down menu را برای سیستم وردپرس گذاشتم.نمونه ی این هیدر سربرگ وب سایت خودم هستش.این هیدر در همه مرور گره به درستی بدون هیچ نوع کد اضافی کار می کند.
1-ابتدا شیوه نامه زیر را به شیوه نامه یا استایل خود اضافه کنید.
/* ------- body2 ------- */ .body2 {width: 960px;margin: 5px auto;color: #666;text-align:right;font-family:BYekan, Tahoma; font-size:13px;} a {color: #333;} #nav {margin: 0;padding: 7px 6px 0;background: #7d7d7d url(images/gradient.png) repeat-x 0 -130px;line-height: 100%;border-radius: 2em; -webkit-border-radius: 2em; -moz-border-radius: 2em; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4); } #nav li {margin: 0 5px;padding: 0 0 8px;float: right;position: relative;list-style: none;} /* main level link */ #nav a {font-weight: bold;color: #e7e5e5;text-decoration: none;display: block;padding: 8px 20px;margin: 0; -webkit-border-radius: 1.6em; -moz-border-radius: 1.6em; text-shadow: 0 1px 1px rgba(0,0,0, .3); } #nav a:hover {background: #000;color: #fff;} /* main level link hover */ #nav .current a, #nav li:hover > a {background: #666 url(images/gradient.png) repeat-x 0 -40px;color: 37badc; -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2); box-shadow: 0 1px 1px rgba(0,0,0, .2); text-shadow: 0 1px 0 rgba(255,255,255, 1); } /* sub levels link hover */ #nav ul li:hover a, #nav li:hover li a {background: none;border: none;color: #666; -webkit-box-shadow: none; -moz-box-shadow: none; } #nav ul a:hover { background: #0078ff url(images/gradient.png) repeat-x 0 -100px !important; color: #fff !important; -webkit-border-radius: 0; -moz-border-radius: 0; text-shadow: 0 1px 1px rgba(0,0,0, .1); } /* dropdown */ #nav li:hover > ul {display: block;} /* level 2 list */ #nav ul {display: none;margin: 0;padding: 0;width: 185px;position: absolute;top: 35px;left: 0;background: #ddd url(images/gradient.png) repeat-x 0 0;border: solid 1px #b4b4b4; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); box-shadow: 0 1px 3px rgba(0,0,0, .3); } #nav ul li {float: none;margin: 0;padding: 0;} #nav ul a {font-weight: normal;text-shadow: 0 1px 0 #fff;} /* level 3+ list */ #nav ul ul {left: 181px;top: -3px;} /* rounded corners of first and last link */ #nav ul li:first-child > a { -webkit-border-top-left-radius: 9px; -moz-border-radius-topleft: 9px; -webkit-border-top-right-radius: 9px; -moz-border-radius-topright: 9px; } #nav ul li:last-child > a { -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9px; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; } /* clearfix */ #nav:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;} #nav {display: inline-block;} html[xmlns] #nav {display: block;} * html #nav {height: 1%;}
سپس به برگ header.php رفته و کد زیر را در هر جایی که می خواهید سر منوی کشویی یا همون آبشاری نمایش داده بشه اضافه کنید.
<div class="body2"> <ul id="nav"> <li><a href="#">صفحه اصلی</a></li> <li><?php wp_list_cats('sort_column=NAME&optioncount=0&hierarchical=1'); ?></li> <li><a href="#">درباره ما</a></li> <li><a href="#">تماس با ما</a></li> </ul></div>
فقط این نکته رعایت شود که این کد در زیر <body> باید قرار گیرد.
کد
<?php wp_list_cats('sort_column=NAME&optioncount=0&hierarchical=1'); ?>
موضوعات مطالب شما را به صورت خودکار و آبشاری تنظیم می کند.اگر دوست داشتین آن را بردارید و لینک های خودتان را قرار دهید.در ضمن می توانید با ویرایش شیوه نامه ظاهر منو را هم به شکل دلخواه تغییر دهید.
امیدوارم به عنوان اولین مطلب سایتم به درد شما خورده باشه!
متشکرم فقط با عرض شرمندگی میشه بگید کدوم قسمت و باید چه گار کنم
چون کلا از برنامه نویس چیزی بلد نیستم متشکر ببخشید وقتتون گرفتم
خواهش میکنم دوست عزیز:)
اگر فایل قالب رو دارین جایگزین کنید بهتره به نظرم(البته به شرطی که تغییرات دلخواهی به قالب نداده باشید) اما اگر ندارین بهتره از جایی که قالب رو تهیه کردید بخواین براتون مشکل رو رفع کنن
موفق باشید..
سلام خدمت شما
با عرض معذرت من این دو تا کدو
‘categories’ ) ); ?>
‘pages’ ) ); ?>
تو سه قسمت style-php header و function کپی کردم و بعد از سیو تغییرات دیگه سایتم بالا نمیاد
اگر کمک کنید ممنون میشم
بازم ببخشید وقتتون گرفتم
اینم سایتم
www. bakhmaly .ir
سلام روز بخیر، از طریق هاست یا اکانت افتیپی اقدام کنید و به حالت قبل برگردونید
موفق باشید..
چجوري ميشه عرضشو تمام صفحه كرد؟
سلام
از داخل استایل باید width رو متناسب کنید .
سلام .
اولا ممنون از پست خیلی مفیدتون
فقط من وقتی این دستورو اجرا کردم قالب سایتم تو موبایل بهم ریخته شد .
تا قبل از اون تو موبایل دقیقا اندازه صفحه موبایل میومد ولی الان نه :(
عالی بود ممنون
خیلی عالی بود
تشکر
دستت درد نکنه . . .
مثل همیشه مفید بود . . .
سلام
تو سایتم یک فهرست بال وجود داره
می خوام فهرستم آبشاری بشه
چکار کنم
سلام من با شکل باز شدن منو تو سایتم مشکل دارم چیکار کنم؟
سلام
اول از همه بگم که من هیچی از اینترنت سر در نمیارم و تازه کارم
من سایتی ساختم و با وردپرس کار می کنم
از مطالب شما هم استفاده کردم ولی نمیدونم شیوه نامه کجاست
لطفا راهنماییم کنید
سلام خسته نباشيد ميخواستم مطالب رو توي ستون موضوعات وب كشويي كنم چيكار كنم؟
سلام آرش جان یه سوال داشتم
میشه بگید چجوری باید گزینه هامو بیشتر و زیر اون ها زیر مجموعه بزارم ممنون
سلام من این کار رو انجام دادم ساخته شد این رنگش رو چه جوری عوض کنم و اینکه لینک هاش چرا خرابه اگه میشه یک نگاه به سایتم بکنین
سلام… داداش میشه بیشتر راهنمایی کنی؟ من کدو کپی میکنم اما جواب نمیده…
سلام
الان کجای کار رو مشکل دارید بفرمایید راهنمایی کنم …
سلام
من میخوام این منوها رو توی ستون راست قالبم بزارم باید چی کار کنم؟
درظمن نتونستم فهرست ها رو تغییر بدم!!!
سلام
منو برای header سایت هستش نه منوها دوست عزیز
سلام
خیلی کارت کارسازبودانشاالله درهمه ی زمینه سلامت وموفق باشی استادعزیز
باتشکر
سلام آرش خان
یه سوال چطوری میشه توی همین کدی که شما قرار دادی
بگیم که مثلا فهرست هایی که تو سایت قبلا تعریف کردیم نشون داده بشه؟
آخه میخوام موضوعات سایت اینجوری نشون داده نشه
اگه همون فهرست هایی که چینده شده رو نشون بده خیلی عالی میشه
سلام
ما توی کدها از کد نمایش موضوعات خودکار وردپرس استفاده کردید ؛ اگر نمی خواهید می تونید به صورت دستی منوها رو توش وارد کنید زمانی هم نمی بره
با تشکر
درود میفرستم از دور برات
وقت کردی بگیرش :) ارادت داریم پسر
سلام ببخشید آرش جان همیشه برات زحمت دارم من سایتم فهرست بالام برگهامو نشون میده خیلیم تلاش کردم اون منورو پاک کنم منویی که گذاشتیرو بزارم ولی نتونستم میشه راهنماییم کنی؟
مطمئنم اگر راهنماییم کنی سردر نمیارم! D:
دستم به دامنت کمکم کن!
من الان دقیقا چکار کنم ؟!
سلام ممنون ازتون بابت این آموزش فقط یک سوالی داشتم چجوری میشه این منوها رو به شکل مستطیلی درش آورد بجای اینکه دورش گرد باشه هم وقتی که وقتی که به طور عادی نشون میده هم وقتی موس رو منو میبری کلا میخوام گردای دور منو برداشته بشه ؟؟؟
ممنون
سلام
بله باید شیوه نامه رو ویرایش کنید ، برای قالب خودم هم همین کارو انجام دادم.
درود
اصلا منو آبشاری برای من درکار نیست؟ یعنی فقط 3 تا تب پیش فرضی که خودتون گزاشتید هست یه تب هم به اسم دسته بندی نشده و من هرچی تو پیشخوان دسته و زیر دسته میسازم اصلا اضافه نمیشه
من منو خودمم حذف کردم جاش مال شما رو گزاشتم جون 2تا با هم جالب نبود
اما منو کشو نمیشه ؟ در واقع چجوری به منو دسته و زیر دسته اضافه کنیم
سلام
اگر طبق توضیحات سایت مراحل رو انجام داده باشید نباید مشکلی باشه.
یکبار کدهاتونو و کدهای قالب رو نگاه کنید ببینید مشکل از کجاست.
سپاس
درود
درواقع مثل این میمونه که منو شما اصلا ربطی به منو اصلی یا همون دسته ها نداره!!
شما مطمئنید همه چی اوکی هست ؟
در واقع اینکه اولش 2تا منو تو سایت هست (یکی ما خود قالب و یک هم مال شما) درست بود و اینکه من منو اصلی قالب رو که ثابت بود و کشویی نمیشد رو حذفش کردم درسته؟
نکته خاص دیگه ای نداره که تو توضیحاتتون جا مونده باشه؟
سلام
بله همه چیز درست هستش و نمونه همین کد رو بالای سایت خودم منوی آبی رنگ رو می تونید ببینید.
سلام
ممنون از مطلب بسیار خوب و مفیدتون
من منو این سایت رو میخوام کشویی کنم اما نمیخوام استایلش عوض بشه میشه کمکم کنید؟
سلام
خواهش می کنم امیدوارم مفید بوده باشه مطلب.
برای کشویی کردن می تونید از همین کدها به عنوان نمونه استفاده کنید و یکم وقت بزارید همون منوی خودتون رو کشویی کنید.
من نمیدونم کدوم قسمتش رو باید تغییر بدم تا استایل عوض نشه
میشه راهنمایی کنید؟
یکم باید آشنایی داشته باشید خوب.بهتره بدین یک نفر دیگه براتون انجام بده.
سایتت عالیه دستت درد نکند
تمام پست هایت را دیدم مطالب جالبی گذاشتی ممنون
منظورتون کدوم کدهاست متوجه نشدم!
راستش منم منظورتونو متوجه نشدم !! کجا رو منظورتون هست ؟!
سلام میشه از این کد برای سیستمی غیر از ورد پرس هم استفاده کرد؟ برای سایر سایتها باید چیکار کنیم؟
سلام
بله داخل نوشته هم قید شده کد html هستش و داخل هر نوع سایتی قابل اجراست فقط اون کدهای php مربوط به وردپرس رو خذف کنید.
خیلی کارت درسته مدتها قالبی که ویرایش کرده بودم برای بخش موضوعاتش که می خواستم دروپ دان باشه مونده بود الان درستش کردم ممنون
قابلی نداشت دوست عزیز !
به قوله دوستم میشه 2 هزار تومان !!
راستی کد یکم مشکل داره و از چپ باز میشه ، من خودم تو قالب خودم درست کردم و نوشته هم ویرایش میکنم به زودی
اما استایل منوی آبشاری قالب منو کپی کنید ، هم راست چین هستش هم گوشه هاش مربعی ! اگر خواستین
سلام…خیلی ممنون از این کد!من یه مشکل داشتم!
داداش فرض کن من یه نوبم!که هستمD:از کجا بدونم این کدو کجا باید گذاشت؟لطفا واسه کسایی مثله من که تازه کارن خوب راهنمایی کن و محل قرار گرفتن کد ها در شیوه نامه و سربرگ رو توضیح بده اینکه باید بالای کدا یا پایین کدا قرار بگیرین یا اصلا فرق نمیکنه؟؟؟؟
واین کدی که میگی باید زیر bodyقرار گیرد:
رو باید زیر کدوم bodyقرار بدم کد اولی که گذاشتی یا دومی؟؟
اینا رو جواب بدی خیلی ممنونت میشم!
یعنی همه ی ما نوبا ممنونت میشیم!!D:
سلام ! این واژه “نوب ” رو فقط تو گیم نت ها و سره بازی وارکرفت فقط میگیم ما ! فکر نکنم جایه دیگه استعمال داشته باشه !! تازه کار بهتره اینجا
البته شما استاد ما هستی ;)
کد اول که شیوه نامه هستش رقی نداره کجا قرار بدی ، برو آخر شیوه نامه همون آخر پیست کنش ! الان حتما میگی شیوه نامه کجاست ؟!؟!
دومی ولی فرق داره و نمیشه همینطوری گفت باید یکم دیگه خودتون با کدا آشنایی داشته باشین اینجوری بود که همه طراح وب می شدن !! اگر نتونستی قالبتو تو قسمت تماس با ما پیوست کن خودم برات ردیفش کنم ! ما کلن1 هستیم !
سلام
از کد های که در لینک قرار دادید تشکر
منتظر کد های قراردادن موزیک هستم
در اولین فرصت حتما !
دوباره سلام
یعنی جی نمیتونی تو هیج کجای سایتم کلیک کنی البته من هنوز منو کشویی نذاشتما فقط میگم کدی بلد نیستی که وقتی کشوم باز میشه زیر اسلایدرم نره؟
البته اون درسخونی هم شوخی کردم ناراحت نشیا ما بچه های برق معمولا با مکانیک و پزشکی ها زیاد کل کل میکنیم:-)
سلام ، اونموقع با یه سیستم دیگه بودم ، شاید مشکل از اون بود ولی فقط سایت شما اونطوری بود !
نه راستش ، که اسلایدر نیاد روی منوی کشویی …
راستی یه سوال دیکه و اینه با این روش شما یه منو ساخته میشه که کشویی هم هست ولی نمیشه کاری کرد که منو سایت خودم که الان دارم همون رو کشویی کنم-یه سر به سایتم بزن میبینی
فقط بازم میگم تورو خدا کامل راهنمایی کن چند روز دنبال این کارم از درس و زندگی افتادم
تازه فکر نکن فقط خودت درسخون هستیا-بعله!!!!!
باید خیلی روش کار کنید فکر کنم از همون کد آماده استفاده کنید خیلی بهتر باشه !
ما ادعایی نکردیم ; ) ، سپاس
با سلام
آرش جون شرمنده ولی سایت من اسلایدر داره و کشو منوهام که باز میشه میره زیر اسلایدرم حالا باید چکار کنم ممنون اگه راهنمایی کنی
فقط تورو خدا راهنماییت واضح باشه
راستی یادم رفت از وب سایتت تشکر کنم-ممنون
سلام خیلی ممنون
من وب ایتتو دیدم اصلا نمی تونم هیچ کجا کلیک کنم ! فکر کنم قالب مشکل داره اینطوری هستش.یه بررسی بکن.
تشکر
با تشکر از شما
سلام
دادا من یه سوال دارم :
من با سی اس اس و جی کوئری یه منو ساختم ولی وقتی منو باز میشه اینطوری میشه :
http://uploadtak.com/images/k5229_what.png
باید چیکار کنم بدنه ی سایت جا به جا نشه ؟
ممنون میشم گه پاسخ بدید .
سلام
والا شیوهنامه رو ندیده نمیشه نظر داد ولی به نظر من برید ببینید بقیه منوها چطورین شما هم از همون کلاس استفاده کنید تا مثل بقیه منو ها قالب سایتتون رو بهم نزنه
دستت دردنکنه دادا فهمیدم چجوریه !
اگه position رو مقدارش رو Absolute بزایم دیگه بدنه حرکت نمیکنه.
:D
سلام داداش….
من تو پیکسلاش دست بردم گند زد به سایتم….
کلا چیزه باحالیه ولی واسه من که دسته بندیام زیاده باحال نمیشه…
خوی میتونی فاصله ها را کمتر کنی موضوعات بیشتری توش قرار بگیره همینطور از فونت و سایز ریز تر استفاده کنی
سلام
چطوری لینک های دستیهم زیر مجموعه دار کنم؟؟؟
راستش اینم نمیدونم ؟!!
علیه؟ فقط اگه بخوایم منو بچسبه به بالای صفحه کدش چجوریه ؟
باید مفادیر فاصله یا حاشیه ها رو که margin و padding میباشد صفر کنی البته از بالا فقط !
درسته از چپ باز میشه چون که منبع کد انگلیسی بود باید تنظیمات شیوهنامه رو تغییر بدید تا از راست بشه.
بله اون کد سومی رو برای تاکید آوردم بگم که این کده که موضوعات وردپرس رو براتون مرتب میکنه شما همون کد دوم رو فقط بزارین
این که میره زیر ساید بار مربوط میشه به قالبتون الان این کد رو چندتا سایت هست مشکلی نداره یکم نگاه کنید ببینید مشکل از کجاست
باز اگر امری بود در خدمتم
آقا ارش سلام
اول ممنون ازاین کدی که گذاشتی
دوم اینکه من این کد را گذاشتم ولی وقتی زیر منوها باز میشه میره زیر سایدبار قرار میگیره وهمچنین زیرمنوها جهتش به طرف راست هست یعنی حرکنش به طرف چپ نیست!!
سوم اینکه کدسومی که نوشتی
توکد دومی هم موجوده دقیقا باید کجا بذارمش
ممنونم اگر درست راهنمایی کنید
مرسی دستت درد نکنه.
سلام دوست عزیز
ممنون از آموزش خوبت
موفق باشی ایشالا
یاعلی مدد
سلام عالی بود فقط کجای استایل باید دستکاری بشه تا منو و زیر منوهاش از سمت چپ باز بشه؟؟؟ لطفا کدش رو بنویسید
سلام
من کد رو کپی کردم اما منوها بصورت عادی هستن،حتی نامش رو هم تغییر دادم باز هم نشد.
لطفا راهنمایی بفرمایید…
باید ابتدا کد های شیوه نامه رو اضافه کنید و سپس کد های html مربوط به منو
اگر عادی هستش حتما کدهای شیوه نام(css) را به قالب اضافه نکردید
سلام خسته نباشید خیلی باحاله-خیلی هم دنبالش بودم راستی کجای استایل باید دستکاری بشه تا منو و زیر منوهاش از سمت چپ باز بشه؟؟
لطفا اگه میشه آموزش کامل رو بذارید که زیر منو ها به سمت چپ باز بشن
باید تو شیوه نامش یکم دست ببری ، کاره زیاد سختی نیست !
فکر کنم باید یکم مقادیر پیکسل ها رو عوض کنی تا از چپ بشه
برا راهنمایی لینکی، آموزشی چیزی نداری؟
باید css نوشتن بلد باشی تا بتونی تو استایل دست ببری ، ولی بده یه نفر برات انجام بده خیلی راحت تره !
ممنون بابت مطلب مفیدت
یه سوال
تو وبسایتم یه ستون دارم که سمت چپ صفص
چطور میتونم بیارمش سمت راست؟
باید تو شیوه نامه قالبت دست ببری ! یکم پیچیدست !
کدم چرا نیومد؟
فکر کنم وردپرس برای مسائل امنیتی و اسپم ها شاید!! نمی زاره بعضی کدها رو !!!
سلام داداش یه چیزیو یادت رفت بنویسی بخاطر همینم بچه ها نتیجه نمیگیرن. باید رو از هدر حذف کنید و جاش رو بزارید اکی میشه
کدت نیومد ؟! بزار چک می کنم ببینم شاید از نظرات سایت باشه
داداش یه چیو ننوشتی باید بادی رو پاک کنن جاش یه چی دیگه بزارن ولی من کدو کپی کنم نمیاد خودت احتمالا میدونی کدش چیه
نه رفیق
کد کاملا سالمه اون body هم نوشتم که یعنی زیر اون بزارن نمایش داده بشه تو سایت.
این کدو آیدا خانم (چندتا کامنت بالاتر) و همینطور خودم دارم ازش استفاده می کنم.هیچیش نیست !
دستت درد نکنه
سلام این کد را برای رزبلاگ میخاستم
فرقی نمی کنه تو همه ی وبلاگ ها قابل استفادست من فقط یک خط کد برای وردپرس بهش اضافه کردم اونو بردارید و ازش در وبلاگتون استفاده کنید.
باید کدهای شیوه نامه رو اضافه کنید و شیوه نامه رو خودتون آپلودش کنید و کدهای html را به قسمت تنظیمات قالب وبلاگتون اضافه کنید.
سلام آقا آرش ممنونم از این پستت که واقعا خیلی بدردم خورد و دیدگاهت که داخل سایتم قرار دادی. به زحمت سه سوال ازت داشتم اول اینکه چطور میشه قسمت ورود به سایت رو همینطور که خودت حذف کردی حذف کرد و دوم اینکه من در آلکسا ثبت نم کردم و سایتم رو هم ثبت کردم اما هنوز رنکینگم نشون نمیده و سوم اینکه از چه سئو استفاده میکنی که آمار سایتت بالا رفته ؟
سلام خیلی خوشحالم که مفید بود براتون.
1-قسمت ورود به سایت یا همون اطلاعات یک ابزارکه.برید به قسمت ابزارک قالبتون و اونو حذف کنید!
2-شکیبا باشید !! نشون میده
3-خیلی سوالتون کلی هستش !! مهم تریناش مطالب کپی نیست و خودم می نویسم و انصافا کاربردی و مفید هستش.قالب,استفاده از برچسب ها و … .
بازم به ما سربزنید
موفق باشید
ممنونم
به امید روزی که سایتتون پر از بازدید کننده باشه
آرش جان بنظرم از هر اسکریپت یا کدی که میخوای آموزش بدی یه تیکه html بساز و به صورت زیپ بزار برای دانلود دوستان تا به مشکل نخورند
دستت درد نکنه.آره فکر کنم این طوری بهتر باشه تضمین شده کد در اختیار ملت می زاریم !!
سلام دوست عزیز
همه کار هایی که گفته انجام دادم متاسفانه نشد اون کدی که گفتی وقتی زیر بادی میزارم که شکل سایت بهم میریزه
سلام
خوب این دقیقا تو سایته خوده منه مشکل نداره.فکر کنم شما تو شیوه نامتون body2 رو داشته باشید خوب .body2 رو عوض کنید یک اسم دیگه بزارید !! نشد باز بگین همفکری کنیم تا درست شه
موفق باشین
خیلی زیباست منوهای سایتت
میدونی از چی خوشم اومده ؟
اینکه خلاقی
هر تیکه رو از یه جا برداشتی و یه سایت توپ راه انداختی
کیمیا از خاک زر ساختن است
به نظرم تو یک کیمیاگر هستی
خیلی خوشم اومده
انشالله همیشه موفق باشی
راستی خیلی خوشحالم آر اس اسم کردی . خیلی ممنونم از لطفت
راستی من است رو دیدم اما متاسفانه تو بیمارستان بودم و شارژ نداشتم جواب بدم
راستی این آیدیمه : vahab00
خواستی ادد کن
بازم خیلی از آشناییت خوشحالم
یا حق
خیلی آقایی وهاب جان.ما سلیقه هامون تقریبا تو طراحی یجوره البته من هنوز اول راهم چند روزه وبم بالا اومده !!
یه دنیا ممنون.خیلی دنبالش بودم
مر30
خواهش !!