توی این مطلب در خدمت دوستان عزیز هستیم با آموزش ساخت گالری تصاویر رسپانسیو با افزونه FooGallery برای وردپرس از وب سایت آموزشی سورس باران. مدیریت نمایش تصاویر و ایجاد گالری تصاویر رسپانسیو در وردپرس بسیار مهم است به طوری که هم دارای ظاهری زیبا باشد و هم در تمامی نمایشگرها به درستی و زیبایی قابل مشاهده باشد. از همه مهم تر کاربرپسند بودن گالری تصاویر همیشه مد نظر است. ساخت گالری کار بسیار ساده ایست اما نکته مهم مدیریت گالری تصاویر و نحوه نمایش آن است! برای این منظور افزونه های بسیاری با هدف ساخت گالری تصاویر در وردپرس وجود دارند اما آیا همه آنها رسپانسیو و کاربر پسند هستند؟! یقینا همه این افزونه ها ریسپانسیو نیستند. در ادامه با ما همراه باشید با آموزش ساخت گالری تصاویر رسپانسیو با افزونه FooGallery برای وردپرس….
گالری تصاویر رسپانسیو برای وردپرس
افزونه ای که قصد معرفی و آموزش آن را داریم به نام FooGallery ثبت شده که به دلیل محبوبیت بالا و دارا بودن افکت های جذاب تاکنون بیش از ۱۰۰۰۰۰ نصب فعال داشته و با آخرین نسخه وردپرس سازگاری کامل دارد. این افزونه دارای اکستنشن های متعدد و جالبی است که جذابیت کار با این افزونه را دو چندان نموده. یکی از این افزودنی ها، افزونه foobox برای ایجاد تصاویر لایت باکس در وردپرس است که در مقاله های بعدی به آن اشاره می کنیم.
ویژگی های افزونه FooGallery
- پشتیبانی از تصاویر رتینا
- امکان افزودن ویدئو به گالری تصاویر رسپانسیو در وردپرس
- امکان ایجاد یک آلبوم کامل از تصاویر
- گالری پست های سفارشی
- استفاده از کتابخانه چند رسانه ای برای مدیری تصاویر
- امکان درگ و دراپ کردن برای تصاویر
- دارای تم های مختلف
- و…
آموزش نصب و راه اندازی پشتیبانی آنلاین وردپرس با افزونه Crisp
آموزش کار با افزونه FooGallery
ابتدا برای ساخت گالری تصاویر رسپانسیو در وردپرس، افزونه را از انتهای صفحه دانلود کرده و اقدام به نصب و فعال سازی آن کنید. بعد از نصب منوی جدیدی به نام FooGallery به پنل مدیریتی وردپرس شما اضافه میشود.
افزونه FooGallery شامل شش زیرمنو به شرح زیراست
- گالری ها: جهت مشاهده گالری هایی که به کمک این افزونه طراحی کرده اید.
- اضافه کردن گالری: جهت ساخت گالری جدید
- تنظیمات: جهت اعمال تنظیمات پیکربندی
- اکتنشن ها: مشاهده افزودنی های رایگان و غیررایگان
- کمک: راهنمای کلی کارباافزونه
- اطلاعات سیستم: مشاهده اطلاعات مربوط به افزونه، خطاها و اطلاعات کلی وردپرس
مراحل ساخت گالری تصاویر رسپانسیو
برای شروع کار بر روی زیر منوی ساخت گالری کلیک کرده و در صفحه باز شده عنوان گالری را نوشته سپس روی عبارت اضافه کردن رسانه کلیک کرده و تصاویری که قصد درج آنها در گالری تصاویر رسپانسیو در وردپرس را دارید انتخاب کنید. برای هر گالری شورت کدی وجود دارد که برای استفاده از گالری آن را در برگه یا نوشته خود جایگذاری میکنیم.
در همین صفحه، در کادر پایینی میتوانید تمامی تنظیمات مورد نظر خود را جهت نحوه نمایش، سایز تصاویر، نوع نمایش، چینش و … تنظیم کنید که همگی واضح هستند و در آخر قابلیت اعمال css را در کادر انتهایی دارید. در پایان تنظیمات دکمه انتشار را کلیک کنید تا گالری تصاویر رسپانسیو در وردپرس ذخیره شود.
نکته: در صورت فعال کردن اکستنشن های این افزونه، موارد فعال شده در کشوی نمونه گالری آماده اضافه میشود. پس نوع نمایش گالری خود را میتوانید از این کشو انتخاب کنید. برای هر گالری میتوان تنظیمات نمایشی منحصر به فرد و خاص خودش را اعمال کنید. این قابلیت به شما امکان میدهد تا بتوانید گالری های متنوع با سبک های مختلفی بسازید.
استفاده از شورت کدها
برای تعبیه گالری تصاویر رسپانسیو در وردپرس، به قسمت گالری ها رجوع کنید و شورت کد مربوط به گالری مورد نظر خود را کپی کرده و در قسمت برگه یا نوشته خود درج کنید.
این افزونه برای سهولت کار کاربران دکمه افزودن گالری را نیز به قسمت برگه و نوشته ها اضافه کرده است.
نتیجه نهایی
پس از درج شورت کد، نتیجه نهایی مطابق تصویر زیر خواهد بود که باتوجه به نیازخود میتوانید ظاهر آن را متفاوت تر طراحی کنید
این مجموعه دارای سبک های نمایشی متفاوت است.
بدین صورت می توانید با کمک افزونه ای که امروز خدمت شما معرفی کردیم گالری تصاویر رسپانسیو در وردپرس را به راحتی و با استایل های مختلفی بسازید.
راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام سورس باران عضو شوید.
- منبع : سورس باران
- رمز فايل : www.sourcebaran.com
- انتشار: ۱۲ مهر ۱۳۹۶
دسته بندی موضوعات
- آموزش برنامه نویسی
- آموزش کریپتو کارنسی (ارز دیجیتال)
- آموزش متنی برنامه نویسی
- پروژه برنامه نویسی
- فروشگاه
- فیلم های آموزشی
- #F
- ++C
- 3ds max
- Ada
- ADO.NET
- Adobe Flash
- Agile
- Ajax
- AngularJS
- Anime Studio
- apache
- ARM
- Asp.Net
- ASP.NET MVC
- assembly
- AVR
- Azure
- Bootstrap
- Cassandra
- CCNA
- CCNP
- CCSP
- ChatGPT
- Cisco
- CMD
- COBOL
- CSS
- Cython
- Django
- Dreameaver
- Elixir
- EntityFramework
- Erlang
- Flash
- Go
- Groovy
- Haskell
- Htaccess
- HTML
- IOS
- Jade
- jquery
- Kendo UI
- Linq
- Linux
- LUA
- MariaDB
- maya
- Meteor
- MongoDB
- Mono Android
- MonoGame
- Mysql
- NoSQL
- Oracle
- Orchard
- Perl
- php
- PHPMyAdmin
- R
- Rational Rose
- Ruby
- Rust
- Scala
- Scrum Master
- SFML
- SharePoint
- SignalR
- silver light
- SQL Server
- Stimulsoft Reports
- Telerik
- UML
- VB.NET&VB6
- Vue 3
- WPF
- Xml
- آردوینو
- آموزش های پروژه محور
- آیونیک
- اتوکد
- الگوریتم تقریبی
- الگوریتم نویسی و فلوچارت
- امنیت
- اندروید
- اندروید استودیو
- انیمیشن سازی
- بازی سازی با Scratch
- بک ترک
- بیسیک فور اندروید
- پایتون
- پرولوگ
- پریمیر
- جاوا
- جاوا اسکریپت
- جنگو
- جوملا
- دارت
- دلفی
- دوره های رایگان پیشنهادی
- زامارین
- سئو
- ساخت CMS
- ساخت اتوران
- ساختمان داده ها
- سی شارپ
- شبکه و مجازی سازی
- طراحی الگوریتم
- طراحی بازی
- طراحی وب
- فتوشاپ
- فریم ورک codeigniter
- فلاتر
- کاتلین
- کامپایلرها
- کانستراکت
- کریستال ریپورت
- کلوژر
- گوگل آنالیتیکس
- گیت
- لاراول
- مای بی بی
- مایکروسافت پروجکت
- متریال دیزاین
- متلب
- معماری کامپیوتر
- مهندسی اینترنت
- میکروتیک
- نود جی اس
- نیوک
- هوش مصنوعی
- ویبولوتین
- ویژوال استودیو
- یونیتی
- کتاب های آموزشی
- Ada
- Ajax
- Android
- ASP.NET
- ASP.NET Core
- AVR
- clips
- CNC
- COBOL
- CQRS
- Cython
- Dreamweaver
- Elixir
- Entity Framework 4.0
- Erlang
- Go
- Groovy
- Haskell
- LINQ
- Lua
- Matlab
- MFC
- Node.js
- PERL
- php
- PLC
- Prolog
- React
- Rust
- Scala
- SFML
- SharePoint
- silver light
- VHDL
- VMware
- WinJS
- Workflow
- WPF
- XHTML
- Yii Framework
- اتوکد
- اچ تی ام ال
- اسمبلی
- اکتیو ایکس
- الگوریتم و فلوچارت
- انگولار
- اوبونتو
- اوراکل
- بازی سازی
- بانک اطلاعاتی
- برنامه نویسی سوکت
- برنامه نویسی موبایل
- بک ترک
- پاسکال
- پایان نامه
- پایتون
- پرولوگ
- جاوا
- جاوا اسکریپت
- جی کوئری
- حوملا
- داده کاوی
- دلفی
- رباتیک
- روبی
- زبان ماشین
- سئو
- ساختمان داده ها
- سایر کتاب ها
- سخت افزار
- سوئیفت
- سی اس اس
- سی پلاس پلاس
- سی شارپ
- سیستم عامل
- سیستم های خبره
- شبکه و مجازی سازی
- شبیه سازی کامپیوتر
- طراحی الگوریتم
- فتوشاپ
- فریم ورک گتنا
- کاتلین
- کالی لینوکس
- کریستال ریپورت
- گزارش کارآموزی
- گوگل
- لیسپ
- متلب
- مقاله
- مهندسی نرم افزار
- نیوک
- هوش مصنوعی
- وب مستر
- ویژوال بیسیک
- نرم افزار و ابزار برنامه نویسی
- وردپرس