رفتن به مطلب

آموزش اضافه نمودن آیکن فونت به منو ها



با سلام و احترام خدمت کاربران ای پی بور ایران

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

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

برای استفاده و اضافه نمودن آیکن فونت ها به منو های بالای انجمن می توانید از کد های زیر در بخش CSS قالب خود بهره ببرید.

 

ایکن فونت.png

 

برای افزودن آیکن فونت ها مسیر زیر را طی نمایید:

بخش شخصی سازی>> قالب>>روبروی قالب مورد نظر>> دکمه ویرایش CSS و HTML

 

وارد بخش ویرایشگر کد های قالب شده و روی زبانه CSS کلیک کرده و گزینه custom.css را کلیک نمایید.

کد های زیر را در پایان کد های این صفحه قرار داده و صفحه را ذخیره نمایید.

#ipsLayout_mainNav a:before,
#elNavMore_menu a:before{
	content: "\f02b";
	font-family: "FontAwesome";
	font-size: 14px;
	font-weight: normal;
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	{prefix="transform" value="translate(0,0)"}
}

html[dir="rtl"] #ipsLayout_mainNav a:before{ margin-right: 0; margin-left: 3px; }
#ipsLayout_mainNav a:before{ margin-right: 3px; opacity: 0.6; }
#ipsLayout_mainNav a:hover:before, #ipsLayout_mainNav a.ipsNavActive:before{ opacity: 1; }
#ipsLayout_mainNav a[id*="elNavigation_app_downloads"]:before{ content: "\f0ed" }
#ipsLayout_mainNav a[id*="elNavigation_app_gallery"]:before{ content: "\f03e" }
#ipsLayout_mainNav a[class*="nexus_Store"]:before{ content: "\f07a" }
#ipsLayout_mainNav a[class*="nexus_Support"]:before{ content: "\f1cd" }
#ipsLayout_mainNav a[class*="blog"]:before { content: "\f02d" }
#ipsLayout_mainNav a[id*="elNavigation_app_calendar"]:before{ content: "\f073" }
#ipsLayout_mainNav a[class*="cms"]:before{ content: "\f0f6" }
#ipsLayout_mainNav a[id*="elNavigation_app_forums"]:before{ content: "\f086" }
#ipsLayout_mainNav a[class*="core_Core"]:before{ content: "\f015" }
#ipsLayout_mainNav a[class*="chat"]:before{ content: "\f022" }
#ipsLayout_mainNav a#elNavigationMore_dropdown:before{ content: "\f0fe"; display: none; }
#ipsLayout_mainNav .fa-caret-down{ font-size: 12px; }

با  ذخیره صفحه و بارگزاری مجدد انجمن خود می توانید این آیکن فونت ها را در منو های خود مشاهده نمایید.

موفق باشید.


 گزارش این آموزش

×