آموزش افزودن Livicons به سایت وردپرس

حتما در سایت میهن وردپرس مشاهده کرده اید که زمان قرار گرفتن موس روی یکی از آیکون های پنل کاربری یا بخش فوتر٬ آن ایکون بصورت متحرک نمایش داده می شود. به این استایل متحرک livicon می گوییم. در این مقاله آموزش افزودن Livicons به سایت را به شما آموزش خواهیم داد.

کاربران سایت شما وقتی وارد سایت می‌شوند علاوه‌بر محتوای متنی با یک سری المان‌های دیگر مثل تصویر، ویدئو و غیره مواجه می‌شوند که تمامی این‌ها باعث می‌شود کاربر سایت شما بتواند بهتر هدف خود را پیدا کند. مفیدترین و بهترین ابزارهایی که شما دارید و می‌توانید در راستای سرعت بخشیدن به رسیدن کاربر به هدفش استفاده کنید، آیکون‌ها هستند.

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

livicon چیست؟

Livicon یک محصول محبوب است که تنها با چند کلیک ساده می‌توانید در محتوای سایت و هر بخش دیگری از سایت که امکان قرار دادن محتوا باشد از آیکون‌های زنده با طراحی بسیار شیک و حرفه‌ای استفاده کنید.

خوشبختانه سازنده این محصول در وب‌سایت خود بخش‌بندی‌های سایت را به خوبی در اختیار ما قرار داده است و همان‌طور که در ویدئو آموزشی که در انتهای این مقاله قرار داده‌ایم مشاهده خواهید کرد که بعد از انتخاب مجموعه آیکون زنده موردنظرمان می‌توانیم کدهای html و css را کپی کرده و در سایت خود مورداستفاده قرار دهیم.

همان‌طور که اطلاع دارید علم طراحی وب هم مانند سایر علم‌ها روزبه‌روز در حال پیشرفت است، قابلیت جدید وب یعنی قابلیت font awesome مدتی است که امکان قرار دادن آیکون به‌صورت متنی را در سایت‌ها فراهم کرده بود، اما جدیداً با این تکنولوژی می‌توان آیکون‌های زنده را نیز روی سایت نمایش داد یعنی آیکون‌های داخل سایت را به‌صورت انیمیشن درآورد.

مزایای استفاده از livicon

آیکون‌های لایو و زنده در این زمینه بازدهی بهتر و بالاتری به نسبت آیکون‌های معمولی دارند و جدا از این موارد آیکون‌های زنده باعث زنده شدن ظاهر سایت می‌شود و همچنین شما می‌توانید مانور بیشتری بر روی طراحی ظاهر سایت خود با این آیکون‌ها داشته باشید. درنهایت باعث بهبود تجربه کاربری سایت خود شوید.

به‌عنوان‌مثال کاربر خیلی سریع‌تر آیکون زنده ایمیل را به نسبت آیکون معمولی آن تشخیص می‌دهد چراکه آیکون زنده جلب‌توجه می‌کند. به همین دلیل است می‌گوییم استفاده از آیکون‌های زنده زودتر باعث می‌شود کاربر زودتر به هدف خود برسد.

یکی از مزیت‌هایی که سازنده این محصول در اختیار ما قرار داده این است که معمولاً در هر زمینه‌ای که فکرش را کنید یک آیکون زنده ساخته و ما می‌توانیم این موارد را در وب‌سایت سازنده مشاهده و به مجموعه فعلی در سایت خودمان اضافه کنیم.

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

نمونه این آیکون‌ها در سایت سازنده یا سایت اصلی livicon است که می‌توانید در انتهای مطلب بخش پیش‌نمایش مشاهده بفرمایید.

سایت سازنده این امکان را در حال حاضر به‌صورت رایگان ارائه نکرده و این تکنولوژی را در سایت codecanyon به قیمت ۱۴ دلار برای فروش قرار داده اما برای کاربران ایرانی چون دسترسی‌شان کمی مشکل است مجموعه‌ای از این آیکون‌ها را به‌رایگان برای دانلود قرار داده‌ایم. امیدوارم مورداستفاده قرار بگیرد و صد درصد به سایتتان جلوه زیبایی خواهد بخشید.

این محصول برای توسعه دهندگان وب و صاحبان سایت است. LivIcons Evolution یک نسل مدرن از پک LivIcons کلاسیک با آیکون های برداری یا وکتور مرورگر با انیمیشن مینی منحصر به فرد برای هر کدام از آیکون ها است که فرمت آنها SVG است، توسط جاوا اسکریپت توسعه یافته و در تمام مرورگرهای مدرن و در هر دستگاه ایده آلی کار می‌کند.

آموزش افزودن Livicons به سایت وردپرس

هدف اصلی این اسکریپت اینه که شخصیت و تعامل بیشتری را با سایت های مشتریان داشته باشیم و باعث شود با هم رقابت کنند و مشتریان بتوانند نظرسنجی کنند. همچنین این افزونه دارای انیمیشن دو بعدی است که یک آیکون می تواند زمانی که اولین بار ظاهر می شود “کشیده شود” و البته، انیمیشنهای خاص خودش را دارد. همچنین یک آیکون می‌تواند با استفاده از API جاوا اسکریپت حذف شود.

امکانات افزونه Livicons

• 375 آیکون متحرک منحصر به فرد
• شامل ابزار پیکربندی آنلاین
• پشتیبانی از ویژوال کامپوزر
• تنظیمات بسیار انعطاف پذیر
• هر آیکون دارای (5) استایل طراحی است
• رسپانسیو
• دارای هاور
• قابلیت autoPlay
• API جاوا اسکریپت و HTML قدرتمند
• بر اساس jQuery و پلتفرم انیمیشن GSAP
• کاملا از ابتدا بازسازی شده است
• در رنگ و اندازه های مختلف
• متحرک و استاتیک
• نمایش به صورت رتینا
• تمام مرورگرهای مدرن

ظاهری متفاوت با Liv Icon

ظاهر سایت ما تاثیر زیادی بر روی نظر کاربران نسبت به سایت دارد. ظاهرسازی سایت ما باید به گونه‌‌ای باشد که کاربران ما در زمان ورود به سایت از دیدن سایت ما لذت ببرند و ترغیب به ماندن و دیدن از صفحات مختلف سایت شوند.

معمولا بسیاری از سایت‌‌ها به محتوا و دیگر مسائل توجه می‌‌کنند و از اهمیت بالای ظاهر سایت خودشان بی اطلاع هستند و به سادگی از این موضوع می‌‌گذرند. در راستای اینکه ما یک سایت زیبا رو به کاربر ارائه بدیم راهکارهای فراوانی وجود دارد که یکی از این راهکارها آیکون‌‌های متحرک و یا زنده هستند که ظاهری متفاوت به سایت ما می‌‌دهند.

داشتن آیکون‌‌های جذاب و زیبا از جمله مواردی است که می‌‌تونه در این زمینه بسیار مؤثر باشد. اینکه ما سایت خودمون را از حالت یکنواختی خارج کنیم نه تنها دردسر زیادی ندارد بلکه باعث بیشتر شدن کاربران سایت نیز می‌‌شود. که در نتیجه این موضوع منجر به رونق سایت ما می‌‌شود.

افزونه Liv Icon یک افزونه‌‌ی حرفه‌‌ای در زمینه آیکون‌‌های زنده است که به ما این قابلیت را می‌‌ده که به سایت خودمون آیکون‌‌های زیبا و متحرک اضافه کنیم. کاربران پس از خرید این افزونه می‌‌تونند به دو روش در سایت خود آیکون‌‌های متجرک قرار دهند. کاربر می‌‌تونه با برنامه‌‌نویسی آیکون‌‌های دلخواه خودش را در سایت قرار دهد و یا اینکه با استفاده از ویرایشگر وردپرس در بخش‌‌های مختلف سایت آیکون‌‌های متنوع و جذاب را قرار دهند.

آیکون‌‌های خود را سفارشی‌‌سازی کنیم

این افزونه به ما امکان سفارشی سازی آیکون‌‌های متحرک خودمون را می‌‌دهد. یعنی نحوه قرارگیری، اندازه، استایل و رنگ‌‌بندی این آیکون‌‌ها همگی به سلیقه ما مربوط و قابل تغییر است.

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

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

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

کاملا واکنش‌‌گرا و رسپانسیو

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

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

یکی از نگرانی‌‌های ما نسبت به این آیکون‌‌های زنده عدم نمایش صحیح در سایت است. با استفاده از این افزونه تمامی آیکون‌‌های سایت ما بدون کوچکترین مشکلی و به زیبایی تمام برای کاربران ما به نمایش در می‌‌آید. در واقع آیکون‌‌ها به نسبت دستگاهی که کاربر استفاده می‌‌کند تغییر اندازه می‌‌دهند و خود را متناسب با صفحه نمایشگر کاربر می‌‌کند.

ما با مراجعه به قسمت پنل افزونه می‌‌تونیم تنظیمات مربوط به این افزونه را به طور کامل تغییر دهیم و تنظیمات را از حالت پیش‌‌فرض خارج کنیم و موارد دلخواه خودمون را در آن جای دهیم.

یکی دیگه از امکانات این افزونه که از نظر مدیران سایت‌‌های مختلف بسیار کاربردی است این است که ما می‌‌تونیم در این افزونه آیکون‌‌ها را به صورت آنلاین تغییر دهیم و تغییرات آن را ببینیم و پس از آن یکی از آیکون‌‌هایی که متناسب با سایت ما است را انتخاب کنیم. این موضوع در انتخاب سریع و تصمیم‌‌گیری بهتر ما تاثیر به سزایی دارد.

افزونه Livicons

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

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

این افزونه دارای صدها آیکون زیبا و جذاب است که همگی آن‌‌ها به ما در داشتن یک سایت حرفه‌‌ای‌‌تر کمک بسیار زیاد می‌‌کنند. البته ویژگی‌‌های امکانات این افزونه در اینجا به پایان نمی‌‌رسد و طراحان این افزونه هر روز به‌‌دنبال به‌‌روز کردن این افزونه و افزایش آیکون‌‌ها و امکانات دیگر هستند تا نیازهای سایت ما را در این باره برطرف کنند و به ما تجربه داشتن یک سایت حرفه‌‌ای را دهند.

اضافه کردن آیکون زنده در وردپرس

اضافه کردن آیکون زنده در وردپرس : افزونه livicons یک افزونه عالی برای نمایش آیکون های وبسایت بصورت زنده می باشد.
با استفاده از این افزونه می توانید آیکون های زنده را بصورت کدنویسی یا بدون کدنویسی به سایت وردپرسی خود اضافه کنید.
در این فیلم آموزشی نحوه اضافه کردن آیکون زنده با استفاده از افزونه livicons را آموزش خواهم داد.

امیدوارم آموزش افزودن Livicons در ارتباط با استفاده از آیکون‌های زنده مورداستفاده سایت وردپرسی شما عزیزان قرارگرفته باشد.

این افزونه را می‌توانید از سایت CodeCanyon.net بصورت مستقیم از سازنده خریداری کنید.

تیم تولید محتوا

ما در تیم تولید محتوای میهن وردپرس در تلاش هستیم تا بهترین مقالات آموزشی در زمینه وردپرس و کسب‌و‌کارهای اینترنتی را تهیه کنیم. صحت محتوای این صفحه توسط رضا راد بررسی خواهد شد.