رفتن به مطلب
پشتیبانی سایت ساز IPB/IPS فارسی
خدمات و محتویات منتشر یافته در IPSFarsi

لرزشی کردن لوگو انجمن

MMahdiD25
 اشتراک گذاری

ارسال‌های توصیه شده

MMahdiD25

MMahdiD25 32

ارسال شده در
ارسال شده در

به نام خدا

سلام

در انتهای این آموزش شما می توانید لوگوی انجمنتون را وقتی که موس بر رویش قرار گرفت, لرزشی کنید. (جمله سنگین بود اما یک باره دیگر بخوانید میفهمید :5862165aa754c_default_DD1:)

دمو یا پیشنمایش : http://bofd.ir/demo_IPS

(دمو از قالب دیفالت و قالب ipbfarsi می باشد.)

1- به آدرس زیر بروید.

شخصی سازی >> ظاهر >> پوسته ها >> قالبه شما >> ویرایش html و css > تب سی اس اس >> custom.css

2- کد زیر را به انتهای کد های استایل قالب ( custom.css ) اضافه کنید. 

@keyframes spaceboots {
0% { transform: translate(2px, 1px) rotate(0deg); }10% { transform: translate(-1px, -2px) rotate(-1deg); }20% { transform: translate(-3px, 0px) rotate(1deg); }30% { transform: translate(0px, 2px) rotate(0deg); }40% { transform: translate(1px, -1px) rotate(1deg); }50% { transform: translate(-1px, 2px) rotate(-1deg); }60% { transform: translate(-3px, 1px) rotate(0deg); }70% { transform: translate(2px, 1px) rotate(-1deg); }80% { transform: translate(-1px, -1px) rotate(1deg); }90% { transform: translate(2px, 2px) rotate(0deg); }100% { transform: translate(1px, -2px) rotate(-1deg); }
}
@-webkit-keyframes spaceboots {
0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
@-moz-keyframes spaceboots {
0% { -moz-transform: translate(2px, 1px) rotate(0deg); }10% { -moz-transform: translate(-1px, -2px) rotate(-1deg); }20% { -moz-transform: translate(-3px, 0px) rotate(1deg); }30% { -moz-transform: translate(0px, 2px) rotate(0deg); }40% { -moz-transform: translate(1px, -1px) rotate(1deg); }50% { -moz-transform: translate(-1px, 2px) rotate(-1deg); }60% { -moz-transform: translate(-3px, 1px) rotate(0deg); }70% { -moz-transform: translate(2px, 1px) rotate(-1deg); }80% { -moz-transform: translate(-1px, -1px) rotate(1deg); }90% { -moz-transform: translate(2px, 2px) rotate(0deg); }100% { -moz-transform: translate(1px, -2px) rotate(-1deg); }
}
@-o-keyframes spaceboots {
0% { -o-transform: translate(2px, 1px) rotate(0deg); }10% { -o-transform: translate(-1px, -2px) rotate(-1deg); }20% { -o-transform: translate(-3px, 0px) rotate(1deg); }30% { -o-transform: translate(0px, 2px) rotate(0deg); }40% { -o-transform: translate(1px, -1px) rotate(1deg); }50% { -o-transform: translate(-1px, 2px) rotate(-1deg); }60% { -o-transform: translate(-3px, 1px) rotate(0deg); }70% { -o-transform: translate(2px, 1px) rotate(-1deg); }80% { -o-transform: translate(-1px, -1px) rotate(1deg); }90% { -o-transform: translate(2px, 2px) rotate(0deg); }100% { -o-transform: translate(1px, -2px) rotate(-1deg); }
}
@-ms-keyframes spaceboots {
0% { -ms-transform: translate(2px, 1px) rotate(0deg); }10% { -ms-transform: translate(-1px, -2px) rotate(-1deg); }20% { -ms-transform: translate(-3px, 0px) rotate(1deg); }30% { -ms-transform: translate(0px, 2px) rotate(0deg); }40% { -ms-transform: translate(1px, -1px) rotate(1deg); }50% { -ms-transform: translate(-1px, 2px) rotate(-1deg); }60% { -ms-transform: translate(-3px, 1px) rotate(0deg); }70% { -ms-transform: translate(2px, 1px) rotate(-1deg); }80% { -ms-transform: translate(-1px, -1px) rotate(1deg); }90% { -ms-transform: translate(2px, 2px) rotate(0deg); }100% { -ms-transform: translate(1px, -2px) rotate(-1deg); }
}
.shake:hover,
.shake:focus {
animation: spaceboots linear 0.8s infinite;
transform-origin:50% 50%;
-webkit-animation: spaceboots linear 0.8s infinite;
-webkit-transform-origin:50% 50%;
-moz-animation: spaceboots linear 0.8s infinite;
-moz-transform-origin:50% 50%;
-o-animation: spaceboots linear 0.8s infinite;
-o-transform-origin:50% 50%;
-ms-animation: spaceboots linear 0.8s infinite;
-ms-transform-origin:50% 50%;
}
.shake {
display:block;
position:relative;
}
a.shake {
display:inline-block;
}

3- به آدرس زیر بروید.

شخصی سازی >> ظاهر >> پوسته ها >> قالبه شما >> ویرایش html و css >> تب قالب ها >> logo

4- اگر در بیت logo کد زیر را مشاهده کردید : 

{{if \IPS\Theme::i()->logo['front']['url'] !== null }}
{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}
<a href='{setting="base_url"}' id='elLogo' accesskey='1'><img src="{$logo}" alt=''></a>
{{else}}
<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1'>{setting="board_name"}</a>
{{endif}}

این کد هارا جایگزین کنید : 

{{if \IPS\Theme::i()->logo['front']['url'] !== null }}
{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}
<a href='{setting="base_url"}' id='elLogo' accesskey='1' class="shake" ><img src="{$logo}" alt=''></a>
{{else}}
<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class="shake" >{setting="board_name"}</a>
{{endif}}

اما اگر کد های بالا مشاهده نکردید کدی که در آن قسمت هست در اینجا ارسال نمایید تا ویرایش کنم و برایتان ارسال کنم. (نمیدونم چجوری بگم که خودتون اضافه کنید چون یکم پیچیده هست)

 

  • توضیحی برای قالب وبسایت IPBFarsi :

اگر شما هم از این قالب بسیار زیبا استفاده میکنید, باید کد های دیگر را استفاده کنید.

و هنگامی که بیت logo را باز میکنید, با کد های زیر مواجه میشوید: 

{{if \IPS\Theme::i()->logo['front']['url'] !== null }}
{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}
<a href='{setting="base_url"}' id='elLogo' accesskey='1'><img src="{$logo}" alt='{setting="board_name" escape="true"}'></a>
{{else}}
<div class='dimlogo'>
<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1'>
  <span class='logoat'><i class="ion-ios-people-outline"></i></span>
 <span class='logott'>IPB Farsi</span>
  <span class='logo_decs'>اولین پشتیبانی IP.Board در ایران
    <span class="logo_dv"></span>
  </span>
</a>
</div>
{{endif}}

که شما می بایست کد های خط پنجم و سوم را تغییر دهید به : 

کد خط سوم :
<a href='{setting="base_url"}' id='elLogo' accesskey='1' class="shake"><img src="{$logo}" alt='{setting="board_name" escape="true"}'></a>

کد خط پنجم :
<div class='dimlogo shake'>

 

امیدوارم از این آموزش استفاده کرده باشید.

منبع : آقای علی مددی

  • پسند 5
لینک ارسال
به اشتراک گذاری در سایت های دیگر
Abbas Ma

Abbas Ma 337

ارسال شده در
ارسال شده در

سلام و خسته نباشید . بی زحمت برای من این رو ویرایش کنید . 

{{if \IPS\Theme::i()->logo['front']['url'] !== null }}

	{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}

	{{if theme.ipsf_mobileTextLogo}}
	
		<a href='{setting="base_url"}' id='elLogo' class='logo hideOnMobile'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
		<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo hideOnDesktop'>
			<span>
				{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
				{{if theme.ipsf_slogan}}<span class='logoSlogan'>{theme="ipsf_slogan"}</span>{{endif}}
			</span>
		</a>
	
	{{else}}
	
		<a href='{setting="base_url"}' id='elLogo' accesskey='1' class='logo'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
	
	{{endif}}

{{else}}

<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo'>
  
	{{if theme.ipsf_textLogoImage}}<img src='{theme="ipsf_textLogoImage"}' alt='' />{{endif}}
	
	<span>
		{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
		{{if (theme.ipsf_christmas) OR (theme.ipsf_valentines) }} <i class="fa fa-asterisk"></i>{{endif}}
		{{if theme.ipsf_slogan}}<span class='logoSlogan'>{theme="ipsf_slogan"}</span>{{endif}}
	</span>
  
</a>
{{endif}}

 

  • پسند 1
لینک ارسال
به اشتراک گذاری در سایت های دیگر
MMahdiD25

MMahdiD25 32

ارسال شده در
  • سازنده
ارسال شده در
در 36 دقیقه قبل، Jon Snow گفته است :

سلام و خسته نباشید . بی زحمت برای من این رو ویرایش کنید . 


{{if \IPS\Theme::i()->logo['front']['url'] !== null }}

	{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}

	{{if theme.ipsf_mobileTextLogo}}
	
		<a href='{setting="base_url"}' id='elLogo' class='logo hideOnMobile'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
		<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo hideOnDesktop'>
			<span>
				{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
				{{if theme.ipsf_slogan}}<span class='logoSlogan'>{theme="ipsf_slogan"}</span>{{endif}}
			</span>
		</a>
	
	{{else}}
	
		<a href='{setting="base_url"}' id='elLogo' accesskey='1' class='logo'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
	
	{{endif}}

{{else}}

<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo'>
  
	{{if theme.ipsf_textLogoImage}}<img src='{theme="ipsf_textLogoImage"}' alt='' />{{endif}}
	
	<span>
		{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
		{{if (theme.ipsf_christmas) OR (theme.ipsf_valentines) }} <i class="fa fa-asterisk"></i>{{endif}}
		{{if theme.ipsf_slogan}}<span class='logoSlogan'>{theme="ipsf_slogan"}</span>{{endif}}
	</span>
  
</a>
{{endif}}

 

سلام

خیلی ببخشید دیر شد

بفرمایید : 

{{if \IPS\Theme::i()->logo['front']['url'] !== null }}

	{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}

	{{if theme.ipsf_mobileTextLogo}}
	
		<a href='{setting="base_url"}' id='elLogo' class='logo hideOnMobile shake'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
		<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo hideOnDesktop shake'>
			<span>
				{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
				{{if theme.ipsf_slogan}}<span class='logoSlogan shake'>{theme="ipsf_slogan"}</span>{{endif}}
			</span>
		</a>
	
	{{else}}
	
		<a href='{setting="base_url"}' id='elLogo' accesskey='1' class='logo shake'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
	
	{{endif}}

{{else}}

<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo shake textLogo'>
  
	{{if theme.ipsf_textLogoImage}}<img src='{theme="ipsf_textLogoImage"}' class='shake' alt='' />{{endif}}
	
	<span>
		{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
		{{if (theme.ipsf_christmas) OR (theme.ipsf_valentines) }} <i class="fa fa-asterisk"></i>{{endif}}
		{{if theme.ipsf_slogan}}<span class='logoSlogan shake'>{theme="ipsf_slogan"}</span>{{endif}}
	</span>
  
</a>
{{endif}}

من احتما خطا دادن کد بالا را می دهم به همین علت درخواست دارم در همه شرایط کد را تست کنید (در حالت موبایل, ورود با یوزر کاربر عادی, خارج شدن از اکانت یا مهمان شدن)

موفق باشید

  • پسند 2
  • تشکر 1
لینک ارسال
به اشتراک گذاری در سایت های دیگر
Abbas Ma

Abbas Ma 337

ارسال شده در
ارسال شده در (ویرایش شده)
در 12 دقیقه قبل، MMahdiD25 گفته است :

سلام

خیلی ببخشید دیر شد

بفرمایید : 


{{if \IPS\Theme::i()->logo['front']['url'] !== null }}

	{{$logo = \IPS\File::get( 'core_Theme', \IPS\Theme::i()->logo['front']['url'] )->url;}}

	{{if theme.ipsf_mobileTextLogo}}
	
		<a href='{setting="base_url"}' id='elLogo' class='logo hideOnMobile shake'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
		<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo textLogo hideOnDesktop shake'>
			<span>
				{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
				{{if theme.ipsf_slogan}}<span class='logoSlogan shake'>{theme="ipsf_slogan"}</span>{{endif}}
			</span>
		</a>
	
	{{else}}
	
		<a href='{setting="base_url"}' id='elLogo' accesskey='1' class='logo shake'><img src="{$logo}" alt='{setting="board_name" escape="true"}' /></a>
	
	{{endif}}

{{else}}

<a href='{setting="base_url"}' id='elSiteTitle' accesskey='1' class='logo shake textLogo'>
  
	{{if theme.ipsf_textLogoImage}}<img src='{theme="ipsf_textLogoImage"}' class='shake' alt='' />{{endif}}
	
	<span>
		{{if theme.customLogoText}}{theme="customLogoText"}{{else}}{setting="board_name"}{{endif}}
		{{if (theme.ipsf_christmas) OR (theme.ipsf_valentines) }} <i class="fa fa-asterisk"></i>{{endif}}
		{{if theme.ipsf_slogan}}<span class='logoSlogan shake'>{theme="ipsf_slogan"}</span>{{endif}}
	</span>
  
</a>
{{endif}}

من احتما خطا دادن کد بالا را می دهم به همین علت درخواست دارم در همه شرایط کد را تست کنید (در حالت موبایل, ورود با یوزر کاربر عادی, خارج شدن از اکانت یا مهمان شدن)

موفق باشید

قربونت مهدی جان . مرسی . اتفاقا خیلی هم سریع بود

چشم تست میکنم میگم . 

کا دمت گرم . مشکل و ایرادی نداره . الان احساس میکنم داره لوگوی انجمنم داره بندری میره . روی گوشی . مهمان . کامپیوتر و صفحات دیگه تست کردم . 

ویرایش شده توسط Jon Snow
  • پسند 1
لینک ارسال
به اشتراک گذاری در سایت های دیگر
 اشتراک گذاری
رفتن به فهرست موضوع ها

  • کاربران آنلاین در این صفحه   0 کاربر

    • هیچ کاربر عضوی،در حال مشاهده این صفحه نیست.
×
×
  • اضافه کردن...