قالب وردپرس در کل عرض. نحوه ایجاد عرض کامل صفحه در وردپرس
وردپرس یک ابزار فوق العاده برای وبلاگ نویسی است، اما متأسفانه کامل نیست. حتی پس از تعداد زیادی به روز رسانی ها و صدها ویژگی جدید برای کار راحت هنوز نیاز به بهبود رابط کاربر اولیه است.
به تازگی، من بسیاری از مقالات لیست طولانی را نوشتم و در فرآیند این مشکل را با ویرایشگر بصری ورودی وردپرس ساخته شده، که قبلا نمی دانستند، یا قبلا با من دخالت نکردم.
در این درس کوتاه، من به شما نشان خواهم داد که چگونه عرض ستون اصلی را با متن در ویرایشگر ورود به سیستم Visual WordPress تغییر دهید.
مسئله
هنگام ایجاد سوابق بزرگ (عمدتا با تصاویر) من مجبور شدم ذخیره و پیش نمایش از پست را ذخیره کنم تا اطمینان حاصل شود که لیست به درستی فرمت شده است. علاوه بر این، من اغلب مجبور شدم متن را به طور مستقیم بر روی تصویر خود بنویسم، زیرا اندازه پنجره ویرایشگر تقریبا یک و نیم برابر بیشتر از هر تصویر من است (و همچنین واحد محتوا اصلی در سایت من):
تصمیم
این تصمیم نسبتا ساده است، اما شما باید بدانید که چگونه آن را در زندگی ایجاد کنید. ابتدا باید عرض فعلی بلوک محتوا را در سایت خود پیدا کنید. در مورد من، عرض بلوک وبلاگ من 650 پیکسل است.
سپس شما باید فایل خود را باز کنید. functions.phpو کد زیر را در پایین فایل اضافه کنید:
تابع fb_change_mce_buttons ($ itararray) ($ itararray ["عرض"] \u003d "650px"؛ بازگشت $ ingearray؛) add_filter ("tiny_mce_beforefore_init"، "fb_change_mce_buttons")؛
نتیجه
به عنوان یک نتیجه، شما ویرایشگر ضبط را مشاهده کنید تکرار عرض بلوک محتوای خود را در سایت خود را. بنابراین، شما مطمئن خواهید بود که هنگامی که یک ورودی را از طریق کنسول مدیر ایجاد می کنید، آن را به عنوان نتیجه نزدیک به نتیجه نهایی نگاه خواهید کرد.
به یاد داشته باشید که برخی از رزولوشن صفحه تنظیمات تنظیمات شما را تغییر می دهد و، به عنوان مثال، تنها یک ستون را نشان می دهد - آن را به عرض محتوای شما بستگی دارد.
اغلب اتفاق می افتد که موضوع مورد علاقه شما دارای یک منطقه باریک برای ضبط است و در تنظیمات آن تغییر در عرض را فراهم نمی کند. در این مورد، می توان آن را با حداقل دانش افزایش داد HTML و CSS . به عنوان مثال، ما از موضوع پاتاگونیا محبوب و رایگان استفاده می کنیم. شما می توانید موضوع را با کمک یک پلاگین فوق العاده گسترش دهید فایرفاکس— آتشبرگ. اول، باید با دانلود از اینجا نصب شود. سپس روشن کنید پلاگین، همانطور که در تصویر نشان داده شده است - زبانه ابزار — توسعه وب — آتشبرگ — باز کردن آتشبرگ:
پس از آن، در پایین صفحه، لازم است، مکان نما را ببندید و روی ماوس کلیک کنید، عناصر مختلف را انتخاب کنید. در همان زمان، در سمت راست، نمایش داده خواهد شد. سبک CSS.، و در صفحه صفحه، این یا آن منطقه برجسته خواهد شد - اصلی ترین نوار کناری, سرتیتر.. ما همچنین به منطقه اصلی علاقه مند هستیم که در آن ما سقوط خواهیم کرد برای مثال، عرض عرض منطقه اصلی با 550 پیکسل، تا 620. برای انجام این کار، شما باید تغییرات را به رشته انجام دهید عرض: 550 پیکسل فایل style.css. اگر موضوع قبلا نصب شده باشد، می توانید این فایل را به طور مستقیم از مدیر ویرایش کنید، اگر نه، شما باید بایگانی را با موضوع باز کنید و با استفاده از ویرایشگر تغییر دهید. در مورد ما، موضوع نصب شده است، بنابراین ما وارد می شویم قمقمه— ظاهر — سردبیر - فایل style.css را باز کنید، ما عرض را پیدا می کنیم: رشته 550 پیکسل را تغییر دهید و مقدار عرض 550 پیکسل به 620 پیکسل را تغییر دهید. ژمم به روز رسانی فایل. ما به سایت می رویم و می بینیم که منطقه پست ها گسترش یافته است، اما در مکان های "ضربه" در ستون سمت راست است. در این مورد، ما باید به طور نسبی این منطقه را محدود کنیم. برای این ما نیز استفاده خواهیم کرد پلاگین Firebug.، همانطور که در مورد قبلی. پیدا کردن برچسب برای تغییر عرض منوی سمت چپ. در این مورد، شما می توانید هر دو پیکسل را تغییر دهید، همانطور که ما در پاراگراف 3-5 و درصد در صفحه انجام دادیم. برای انجام این کار، به اندازه کافی برای تغییر پارامتر به جای پیکسل ها کافی است این مقادیر به این معنی است که چند درصد از عرض می تواند توسط یک عنصر یا یک عنصر اشغال شود. نکته اصلی این است که در مقدار نوار کناری و مقاله 100٪ اشغال شده و نه بیشتر، در غیر این صورت شما در صفحه تورم خواهید بود. این همه است حالا ما می دانیم ارزش هایی که باید تغییر دهیم، به طوری که همه چیز به صورت عمده است. این کوچک است، برای ایجاد اطلاعات لازم در فایل سبک. بعد از اینکه اعداد را درک می کنیم، آنها را در جایی در برگ ثبت کردیم، اکنون آنها را برای همه تغییر دهید، و نه فقط برای خودتان. برای این: شخصا، من اول را برای خودم انتخاب کردم، یک راه آسان، از آنجا که اجازه می دهد تا شما را به طور معنی داری در چند ثانیه تغییر دهید. بنابراین، ما به دنبال یک مقدار از 980 هستیم. جستجو برای فایل تنها دو پارامتر بود که من باید تغییر دهم. اولین کسی مسئول عرض سایت است: #page (Min-Height: 100px؛ پاک کردن: هر دو؛ عرض: 96٪؛ پودر: 0؛ Padding-top: 24px؛ حداکثر عرض: 980 پیکسل؛ سرریز: پنهان؛ دوم عرض دو عنصر، لیست مقالات، و منوی سمت چپ: کانتینر اصلی (عرض: 980 پیکسل؛ حاشیه: 0 خودکار؛ سرریز: پنهان؛ Padding: 0؛ سابقه و هدف: #fff؛ موقعیت: نسبی؛ -Webkit-Box-Shadow: 0px 0px 10px RGBA (50، 50، 50، 0.17) ؛ -moz-box-shadow: 0px 0px 10px RGBA (50، 50، 50، 0.17)؛ جعبه سایه: 0px 0px 10px RGBA (50، 50، 50، 0.17)؛) همه چیزهایی که ما باقی مانده ایم تا ارزش های 980 تا 1080 را تغییر دهیم و دوباره دانلود کنیم. این همه است، اما اگر سوالاتی دارید، در نظرات بنویسید، یا خوشحال خواهم شد که به شما کمک کنم. آیا می خواهید یک صفحه کامل را در وردپرس ایجاد کنید؟
سپس اجازه دهید به چرا ما اینجا هستیم. این روش توصیه می شود اگر تم وردپرس شما در حال حاضر با یک قالب صفحه کامل مجهز شده است. اگر شما آن را ندارید، با انتخاب بعدی خود تماس بگیرید و آن را دریافت کنید.
اول، شما باید صفحه را ویرایش کنید یا یک نفر را با بازدید از آن ایجاد کنید " صفحات\u003e افزودن صفحه جدید در پنجره ویرایش صفحه، را انتخاب کنید تمام عرض به عنوان یک الگو تحت ویژگی های صفات صفحات. پس از انتخاب مدل تمام عرضشما باید صفحه خود را ثبت کنید. شما می توانید پیکربندی صفحه را ادامه دهید تا محتوای بیشتری را اضافه کنید یا روی آن کلیک کنید پیش نمایشبرای دیدن آن در عمل. اگر شما گزینه "عرض کامل" را ندارید - "قالب کامل عرض" - در صفحه ویرایش صفحه خود، این به این معنی است که موضوع وردپرس شما این صفحه را ندارد. اما نگران نباشید، ما به شما نشان خواهیم داد که چقدر آسان است که یک صفحه کامل را بدون تغییر شکل ایجاد کنید. تم های وردپرس.
این روش شما را از ویرایش فایل های وردپرس که استفاده می کنید، و برای درک پایه ای از PHP، CSS و HTML نیاز دارید. به هر حال، ما همچنین از شما دعوت می کنیم که با آن مشورت کنید ابتدا باید باز شود ویرایشگر متن، مانند "دفترچه یادداشت"، و کد زیر را به یک فایل خالی وارد کنید: این کد به سادگی نام قالب فایل را تعریف می کند و از WordPress درخواست می کند تا قالب عنوان را حذف کند. سپس شما به بخشی از محتوای کد نیاز دارید. با استفاده از سرویس گیرنده FTP به سایت خود وصل شوید ( یا مدیر فایل در cPanel) سپس برو به / WP Content / Topics / کاتالوگ موضوعی / .
سپس باید فایل را به نام " صفحه " این فایل پیشنهادی صفحه پیش فرض برای موضوع شماست. همه چیز را بعد از عملکرد کپی کنید " get_header () و آن را به فایل وارد کنید width.php کامل که شما در رایانه خود ایجاد کردید. حالا شما باید محتویات فایل "full-width.php" را ببینید و این رشته کد را حذف کنید: این رشته به سادگی نوار کناری را بازیابی می کند و آن را در تم وردپرس خود نمایش می دهد. از بین بردن آن، موضوع شما هنگام استفاده از یک قالب نوار کناری را نمایش نمی دهد تمام عرض.
شما می توانید ببینید که این رشته چندین بار در تم وردپرس شما ظاهر می شود. اگر تم وردپرس شما چند تا شما هر پانل جانبی را ببینید، که به یک بار در کد اشاره دارد. شما باید تصمیم بگیرید که کدام پانل های جانبی را که می خواهید ذخیره کنید. وب سایت شما به آرامی بارگذاری می شود، برای خودتان کشف کنید اگر موضوع شما نوار کناری را در صفحه خود نمایش نمی دهد، نمی توانید این کد را در فایل خود پیدا کنید. در اینجا این است که چگونه کد کامل width.php ما مراقبت از تغییرات را می گیرد. کد شما ممکن است کمی بسته به موضوع شما متفاوت باشد. سپس شما باید فایل را دانلود کنید width.php کامل در پوشه تم وردپرس خود را با. شما با موفقیت ایجاد کرده و یک صفحه سفارشی کامل صفحه صفحه را برای موضوع خود دانلود کرده اید. گام بعدی استفاده از این الگو برای ایجاد یک صفحه کامل است. به نوار ابزار بروید و یک صفحه جدید را ویرایش یا ایجاد کنید. در صفحه ویرایش صفحه، کادر تأیید صفحات صفحه را پیدا کنید و روی منوی کشویی زیر گزینه "مدل" کلیک کنید. شما می توانید مدل خود را ببینید. به جلو، آن را انتخاب کنید و صفحه را ذخیره یا به روزرسانی کنید. حالا شما می توانید از وب سایت خود بازدید کنید، و شما خواهید دید که پانل های جانبی ناپدید شده اند، و صفحه شما به عنوان یک صفحه با یک ستون نمایش داده می شود. شاید او هنوز پر نشده است، اما اکنون آماده است تا آن را به طور متفاوتی گسترش دهید. سایت خود را محبوب، کشف کنید شما باید از ابزار بازرسی برای شناسایی کلاسهای CSS استفاده شده توسط موضوع خود برای تعیین منطقه محتوا استفاده کنید. سپس می توانید پهنای خود را به 100٪ با استفاده از CSS پیکربندی کنید. ما از کد CSS زیر استفاده کردیم: این همان چیزی است که آن را به نظر می رسد بیست و هفتاد. این همه برای این درس است، امیدوارم بتوانید صفحات کامل را ایجاد کنید. روش های فوق برای کسانی که می توانند هزینه کنند، رایگان هستند و می خواهند به سرعت طرح های کامل یا کامل را ایجاد کنند. شما می توانید سایر پلاگین های وردپرس را برای ارائه یک نگاه مدرن و بهینه سازی مدیریت وبلاگ یا وب سایت خود استفاده کنید. Divi Builder یک طراح صفحه با کیفیت بالا است که بسیار ارزشمند است تم های ظریفاگر چه معمولا به عنوان بخشی از تم وردپرس Divi استفاده می شود، Divi Builder نیز یک پلاگین جداگانه است که می تواند در سایر موضوعات وردپرس استفاده شود. Divi Builder به شما امکان می دهد محتوای خود را با استفاده از رابط بصری در طرف رابط، و همچنین رابط کاربری در سمت سرور ویرایش کنید، اگرچه اکثر کاربران ترجیح می دهند اولین رابط را ترجیح دهند. در واقع، به جای پانل های جانبی، همه چیز در پنجره های پاپ آپ و دکمه های شناور است. این به شما امکان دسترسی به قالب های از پیش تعریف شده 316 را فراهم می کند، که در ارائه های مختلف 40 بسته توزیع شده است، و همچنین به شما امکان می دهد طرح های خود را به عنوان قالب ذخیره کنید. ما پیشنهاد می کنیم باز کنید یکی از ویژگی های دیوی همیشه بر سبک هایی است که به شما می دهد، کنترل شده است. در سه زبانه مختلف، شما می توانید پارامترهای مختلف، از جمله کنترل های سازگار، فاصله قابل تنظیم و خیلی بیشتر پیکربندی کنید. شما حتی می توانید یک CSS سفارشی اضافه کنید زیرا ویرایشگر CSS آن را ترکیبی از چک پایه و خودکار پر کردن می کند.یکی از منتقدان Divi Builder همواره این است که بر اساس آن است، به این معنی است که اگر شما آن را یک بار، یک دسته از کد های کوتاه در محتوای شما باقی می ماند. اگر چه این کمی افسرده است، اما در حال حاضر مشکلات کمتر با چنین پلاگین ها به عنوان تمیز کننده کوتاه وجود دارد. تعجب آور نیست که Themified Builder پیشنهاد تیم تظاهرات است. او آن را به بسیاری از وردپرس خود ادغام می کند تا مشتریان را با تنظیمات ساده ارائه دهد. اما شما همچنین می توانید آن را به عنوان یک پلاگین جداگانه خریداری کنید و از آن با هر موضوع وردپرس استفاده کنید. مانند سازنده Divi Builder و WPBakery Builder، Themify Builder به شما امکان می دهد طرح بندی ها را در رابط کاربری یا باطن ایجاد کنید.یکی دیگر از چیزهای خوب - این افزونه به شما اجازه می دهد تا پاسخگو خود را پیکربندی کنید نقاط کنترل (اما تنها در سطح کل سایت). کشف یک فروشگاه آنلاین ایجاد کنید و به راحتی محصولات خود را در اینترنت به فروش برسانید. یک ویژگی جالب از Themified Builder این است که هنوز هم به شما اجازه می دهد از ویرایشگر استاندارد WordPress استفاده کنید، در حالی که طراحان صفحه دیگر شما رابط کاربری صفحه ساز را برای همه چیز استفاده می کنند. در ابتدا در سال 2016 راه اندازی شد پلاگین وردپرس Elementor یکی از جوانترین توسعه دهندگان این لیست است. علیرغم راه اندازی دیر، Elementor به سرعت تنظیمات فعالتر 1،000،000 را در WordPress.org جمع آوری کرد، که آن را یکی از محبوب ترین طراحان وردپرس می کند. اگر پیشنهادات یا نظرات دارید، آنها را در بخش ما بگذارید
1
عرض: 31.8٪؛
چگونگی بزرگنمایی الگوی افقی قسمت 2، عرض را تغییر دهید
1
2
3
4
5
6
7
8
#page (Min-Height: 100px؛ روشن: هر دو؛ عرض: عرض: 96٪؛ Padding: 0؛ Padding- بالا: 24px؛ حداکثر عرض: 980 پیکسل؛ سرریز: پنهان؛
1
2
3
4
5
6
7
8
9
10
11
. Main-container (عرض: 980 پیکسل؛ حاشیه: 0 خودکار؛ سرریز: پنهان؛ Padding: 0؛ سابقه و هدف: #fff؛ موقعیت: نسبی؛ - جعبه وب سایت - سایه: 0px 0px 10px RGBA (50، 50، 50، 0.17) ؛ - Moz-box- Shadow: 0px 0px 10px RGBA (50، 50، 50، 0.17)؛ جعبه سایه: 0px 0px 10px RGBA (50، 50، 50، 0.17)؛)
روش 1: با استفاده از قالب عرض ساخته شده در تم وردپرس
روش 2: نحوه ایجاد صفحه صفحه با عرض کامل
همچنین چند پلاگین حق بیمه وردپرس را کشف کنید
ما به شما چند پلاگین حق بیمه وردپرس ارائه می دهیم که به شما کمک می کند تا آن را انجام دهید.
1. Divi Builder.
2. سازنده
3. فکیر