افزودن کپشن به تصاویر با افزونه Image Caption Hover در وردپرس

شما با افزودن کپشن به تصاویر د روردپرس این امکان را برای خود فراهم می کنید که تا توضیحات متن به تصاویر خود به وسیله یافکت را به زیبایی اضافه کنید مه این امر موجب افزایش میزان رابط کاربری خواهد شد و در نتیجه کاربرانتان را مجذوب وب سایت خود کنید .
چرا که با داشتن یک رابط کاربری و با استفاده از ظاهر مناسب و امکانات دیگر که باعث زیبایی سایت می شود و این موضوع باعث مورد پسند بودن وب سایتتان توسط کاربرانتان خواهد شد ولی البته باید این امر را مورد توجه قرار داد که بهینه بودن صفحات را نباید به هیچ عنوان فراموش کرد و در جریان انجام این کارها باید موضوع بهینه بودن سایت را مد نظر داشت .
د راین مقاله تیم گستران وب قصد دارد تا افزونه ایی را به شما معرفی کند که به وسیله ی آن قادر باشید تا از قابلیت هایی همچون موضوع همین مقاله عنی کپشن به تصاویر وردپرس بهره ببرید و با استفاده هاورهای زیبایی که در اختیار دارید توضیحاتی که در مورد آن تصاویر مد نظرتان است را بر روی تصاویر قرار دهید .

افزونه‌ای که قصد معرفی آن را دارم با عنوان Image Caption Hover در مخزن وردپرس به ثبت رسیده است و تاکنون توانسته است تا بیش از ۶.۰۰۰ نصب فعال و کسب امتیاز ۴.۸ را ازآن خود نماید که با استفاده از آن می‌توانید برای تصاویر خود کپشن و توضیحات دلخواه و مناسبی اضافه کنید.

نصب و فعال سازی

پس از نصب و فعال سازی افزونه مشابه تصویر زیر منویی با عنوان Image Caption Hover در پیشخوان سایت وردپرسی شما افزوده خواهد شد، روی آن کلیک کنید تا به صفحه ایجاد کپشن در وردپرس هدایت شده و سپس بر روی دکمه Add New در ابتدای صفحه کلیک کنید.

ابتدا یک عنوان انتخاب کرده و سپس به ترتیب زیر سایر ویژگی های تصویر را وارد و انتخاب کنید.

Image URL: تصویر مورد نظر ار آپلود کرده و یا اینکه از رسانه وردپرس آن را انتخاب کنید.

Title: عنوان تصویر را وارد کنید.

Title Font Size: اندازه فونت مورد نظر برای عنوان تصویر را بر حسب پیکسل مشابه نمونه وارد کنید.

Alternate Text: متن جایگزین و یا همان Alt تصویر را وارد کنید تا در صورت عدم نمایش تصویر این متن نمایش داده شود. این گزینه برای بهینه‌سازی صفحه مناسب خواهد بود.

Caption: کپشن و توضیحات مورد نظر برای تصویر را وارد کنید. با کلیک بر روی دکمه Editor که در کنار آن قرار دارد قادر خواهید بود تا از ویرایشگر وردپرس برای استایل‌دهی به متن تصویر استفاده کرده و در صورت استفاده از آیکون و موارد دیگر همچون دکمه در این بخش از آنها استفاده کنید.

Caption Wrapper: از این بخش میزان اندازه Heading برای کپشن وردپرس را انتخاب کنید. از انجایی که تگ H۱ در هر صفحه نباید بیشتر از یک مورد باشد از انتخاب آن در این بخش جلوگیری کنید.

Caption Alignment: چیدمان متن کپشن وردپرس را بر اساس راست، چپ، وسط، جاستیفای و… انتخاب کنید.

در بخش انتخاب رنگ نیز قادر خواهید بود تا به ترتیب رنگ مورد نظر برای عنوان متن، عنوان کپشن و پس زمینه کپشن وردپرس را انتخاب کنید.

Overlay Position: در این بخش می‌توانید مکان روکش برای کپشن وردپرس را به صورت کامل، بالا و یا پایین انتخاب کنید.

Link To: اگر قصد دارید تا در کپشن لینک به صفحه خاص بدهید لینک ان را در این فیلد وارد کرده و سپس در بخش Link Target وضعیت لینک را مشخص کنید که در چه حالتی به کاربر نمایش داده شود.

Hover Effect: از این بخش نیز قادر خواهید بود تا افکت‌های متفاوتی برای نمایش کپشن استفاده کنید تا نمایش داده شود. از جمله این موارد می‌توان به افکت زوم کردن و نمایش کپشن، تغییر حالت از جهت‌های مختلف و نمایش کپشن و… اشاره کرد که در دمویی که در انتهای مقاله رار داده‌ام سه نوع از آن را مشاهده خواهید کرد.

سایر بخش‌های افزونه به صورت تجاری هستند که از توضیحات آنها صرف نظر می‌کنیم. حال اگر قصد دارید تا از چند نوع تصویر استفاده کنید به همین ترتیب با کلیک بر روی دکمه Add New Image که در انتهای صفحه قرار دارد تصاویر دیگری را با کپشن و افکت‌های مختلف ایجاد کنید تا در صفحه در کنار هم به صورت ردیفی نمایش داده شوند.

Display: در این بخش می‌توانید تعیین کنید که چند ستون برای نمایش تصویر مد نظر شماست. در صورتی که از هر تعداد تصویر استفاده می‌کنید می‌بایست برای نمایش صحیح آنها بر اساس همین تعداد تنظیم شده باشد.

Space between images: در این بخش می‌توانید فاصله هر تصویر از یکدیگر را بر حسب پیکسل وارد کنید تا ظاهر مناسب‌تری برای تصاویر خود ایجاد کنید.

Shortcodes in Caption: در صورتی که برای کپشن‌های ساخته شده از مواردی همچون دکمه، نمایش آیکون و.. استفاده می‌کنید که با استفاده از سایر افزونه‌ها که توسط شورت‌کد این امکان را در اختیار شما قرار می‌دهند این گزینه را فعال کنید تا در بخش کپشن وردپرس نمایش داده شوند.

Custom CSS: در این بخش نیز می‌توانید از استایل سفارشی همچون امکان استفاده از فونت مختلف و.. برای کپشن وردپرس استفاده کنید.

پس از اینکه به صورت کامل تصاویر مورد نظر خود را ایجاد کردید با انتشار آن شورت‌کدی در بخش Shortcode اختیار شما قرار داده خواهد شد، آن را کپی کرده و در برگه، نوشته، ابزارک و هر مکانی که قصد دارید تا تصاویر نمایش داده شوند قرار دهید.

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