معاينة
طريقة التركيب
- اولا قم بتحرير قالب مدونتك ثم ابحث عن الوسم <body
- وضع أسفله الأكواد التالية
<b:if cond='data:blog.pageType == "error_page"'>
<!-- Error Page | Nak1ha.com -->
<a expr:href='data:blog.homepageUrl'>
<svg class='svg' style='enable-background:new 0 0 800 800;' version='1.1' viewBox='0 0 800 800' x='0px' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' y='0px'>
<g id='object'>
<ellipse class='st7' cx='408.3' cy='620.2' rx='119.9' ry='14.8'/>
<g>
<g>
<path class='st6' d='M392.4,604.7c-0.6-1.5-2.5-2.7-4.2-2.7l-22.7,0.5c-1.6,0-4.3,0.5-5.8,1.1l-12.9,4.8 c-1.5,0.6-1.5,1.2,0.2,1.4l17.4,1.9c1.6,0.2,3.5,1.6,4.1,3.1l1.1,2.9c0.6,1.5,2.2,2,3.6,1.1l8.3-5.7c1.4-0.9,3.6-1,5-0.2l10,6.1 c1.4,0.9,2,0.3,1.4-1.2L392.4,604.7z'/>
<path class='st6' d='M470.2,616.2l-7.2-11.7c-0.9-1.4-2.9-2.3-4.5-1.9l-19,4.3c-1.6,0.4-4,1.4-5.4,2.3l-9.8,6.5 c-1.4,0.9-1.1,1.6,0.5,1.4l14.8-1.1c1.6-0.1,3.7,0.9,4.5,2.4l1.5,2.6c0.8,1.4,2.4,1.6,3.5,0.3l5.8-6.7c1.1-1.2,3.2-1.7,4.7-1.1 l9.4,4C470.6,618.2,471.1,617.6,470.2,616.2z'/>
</g>
<path class='st6' d='M447.9,402.6c-24.5,0-31.3,13.8-32.4,35.5c-3.6-21.7-13.1-35.5-37.6-35.5c-44.6,0-80.7,45.1-80.7,100.8 c0,42.8,10.4,81.5,53.8,95.5c12.4-1,19.3-7,29.5-7c20.9,0,30.3-7.1,34.3-20.3c2,13.2,9.4,20.3,30.3,20.3c10.3,0,17.2,6,29.5,7 c41.9-20.2,53.8-52.6,53.8-95.5C528.6,447.8,492.5,402.6,447.9,402.6z M417.4,503.9c0-0.9,0-1.9,0-2.8 C417.4,502,417.4,503,417.4,503.9c0,0.8,0,1.7,0,2.5C417.4,505.6,417.4,504.7,417.4,503.9z'/>
<path class='st8' d='M469.7,602.2c2.5-1.1,4.2-2.3,5.1-3.3c18.3-20.2,71.2-83.3,48-136.3c-9.5-21.6-18-57.7-47.5-75.2 c-7.5,12.5-19.1,14-19.1,14s-25.6-5.9-43-6c0,0,0,0,0,0c-0.1,0-0.2,0-0.3,0c-0.1,0-0.2,0-0.3,0c0,0,0,0,0,0c-17.4,0.1-43,6-43,6 s-11.6-1.5-19.1-14c-29.5,17.5-38,53.6-47.5,75.2c-23.2,52.9,34.9,128.2,48,136.3c6.5,4,34.9,12.4,63.8,12.2 C437.7,610.9,459.6,606.7,469.7,602.2'/>
<circle class='st5' cx='360.4' cy='477.6' r='52.7'/>
<circle class='st5' cx='463.9' cy='477.6' r='52.7'/>
<g>
<circle class='st9' cx='453.9' cy='477.6' r='42.7'/>
<g>
<circle class='st10 eye' cx='453.9' cy='477.6' r='26.3'/>
<circle class='st11 eye' cx='453.9' cy='477.6' r='14.9'/>
<circle class='st10 eye' cx='461.4' cy='466.6' r='8.3'/>
</g>
</g>
<g>
<circle class='st9' cx='370.4' cy='477.6' r='42.7'/>
<g>
<circle class='st10 eye' cx='370.4' cy='477.6' r='26.3'/>
<circle class='st11 eye' cx='370.4' cy='477.6' r='14.9'/>
<circle class='st10 eye' cx='377.9' cy='466.6' r='8.3'/>
</g>
</g>
<path class='st11' d='M402.2,489.6c0,0,5.3-4,12.7-4c7.3,0,12.7,4,12.7,4s-8.3,22.7-12.7,22.7S402.2,489.6,402.2,489.6z'/>
<g>
<circle class='st5' cx='383.7' cy='550.5' r='8.1'/>
<circle class='st5' cx='403.7' cy='570.5' r='8.1'/>
<circle class='st5' cx='418' cy='542.4' r='8.1'/>
<circle class='st5' cx='432' cy='570.7' r='8.1'/>
<circle class='st5' cx='451.2' cy='548.8' r='8.1'/>
</g>
</g>
<path class='st5 heart five' d='M451.4,343.5c-0.5-2.8-1.8-5.3-3.9-7.3c-2.1-2-4.7-3.3-7.5-3.7c-0.7-0.1-1.3-0.1-2-0.1c-5,0-9.6,2.7-11.9,7.1 c-2.4-4.3-6.9-7.1-11.9-7.1c-0.7,0-1.3,0-2,0.1c-2.8,0.4-5.4,1.7-7.5,3.7c-2.1,2-3.4,4.5-3.9,7.3c-0.8,4.3,0.5,8.6,3.5,11.8 c0.4,0.5,1,1.2,1.5,1.7c0.2,0.2,0.3,0.4,0.5,0.5c3.2,3.7,10.4,10.6,15.1,14.9c1.2,1.1,2.8,1.7,4.3,1.8c0.1,0,0.3,0,0.4,0 c0.1,0,0.2,0,0.4,0c1.6-0.1,3.1-0.7,4.3-1.8c4.8-4.3,11.9-11.2,15.1-14.9c0.1-0.2,0.3-0.4,0.5-0.5c0.5-0.6,1.1-1.2,1.5-1.7 C450.9,352.1,452.1,347.9,451.4,343.5z M425.9,372.7c0.1,0,0.2,0,0.3,0c0,0-0.1,0-0.1,0C426,372.7,426,372.7,425.9,372.7z'/>
<path class='st5 heart four' d='M491.5,291.6c-0.4-2.1-1.4-3.9-2.9-5.4c-1.5-1.5-3.4-2.4-5.5-2.7c-0.5-0.1-1-0.1-1.5-0.1c-3.7,0-7.1,2-8.8,5.2 c-1.8-3.2-5.1-5.2-8.8-5.2c-0.5,0-1,0-1.5,0.1c-2.1,0.3-4,1.2-5.5,2.7c-1.5,1.5-2.5,3.4-2.9,5.4c-0.6,3.2,0.4,6.4,2.6,8.7 c0.3,0.4,0.7,0.9,1.1,1.3c0.1,0.1,0.2,0.3,0.4,0.4c2.4,2.7,7.7,7.8,11.2,11c0.9,0.8,2,1.3,3.2,1.3c0.1,0,0.2,0,0.3,0 c0.1,0,0.2,0,0.3,0c1.2,0,2.3-0.5,3.2-1.3c3.5-3.2,8.8-8.3,11.2-11c0.1-0.1,0.2-0.3,0.4-0.4c0.4-0.4,0.8-0.9,1.1-1.3 C491.1,298,492.1,294.9,491.5,291.6z M472.7,313.2c0.1,0,0.1,0,0.2,0c0,0-0.1,0-0.1,0C472.8,313.2,472.7,313.2,472.7,313.2z'/>
<path class='st5 heart three' d='M421,257.5c-0.4-2.1-1.4-3.9-2.9-5.4c-1.5-1.5-3.4-2.4-5.5-2.7c-0.5-0.1-1-0.1-1.5-0.1c-3.7,0-7.1,2-8.8,5.2 c-1.8-3.2-5.1-5.2-8.8-5.2c-0.5,0-1,0-1.5,0.1c-2.1,0.3-4,1.2-5.5,2.7c-1.5,1.5-2.5,3.4-2.9,5.4c-0.6,3.2,0.4,6.4,2.6,8.7 c0.3,0.4,0.7,0.9,1.1,1.3c0.1,0.1,0.2,0.3,0.4,0.4c2.4,2.7,7.7,7.8,11.2,11c0.9,0.8,2,1.3,3.2,1.3c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0 c1.2,0,2.3-0.5,3.2-1.3c3.5-3.2,8.8-8.3,11.2-11c0.1-0.1,0.2-0.3,0.4-0.4c0.4-0.4,0.8-0.9,1.1-1.3 C420.6,263.9,421.5,260.7,421,257.5z M402.1,279.1c0.1,0,0.1,0,0.2,0c0,0-0.1,0-0.1,0S402.2,279.1,402.1,279.1z'/>
<path class='st5 heart one' d='M432.8,170.1c-0.2-1.3-0.8-2.5-1.8-3.4c-1-0.9-2.1-1.5-3.4-1.7c-0.3,0-0.6-0.1-0.9-0.1c-2.3,0-4.4,1.3-5.5,3.2 c-1.1-2-3.2-3.2-5.5-3.2c-0.3,0-0.6,0-0.9,0.1c-1.3,0.2-2.5,0.8-3.4,1.7c-1,0.9-1.6,2.1-1.8,3.4c-0.3,2,0.2,4,1.6,5.4 c0.2,0.2,0.5,0.5,0.7,0.8c0.1,0.1,0.2,0.2,0.2,0.3c1.5,1.7,4.8,4.9,7,6.8c0.5,0.5,1.3,0.8,2,0.8c0.1,0,0.1,0,0.2,0c0,0,0.1,0,0.2,0 c0.7,0,1.4-0.3,2-0.8c2.2-2,5.5-5.1,7-6.8c0.1-0.1,0.1-0.2,0.2-0.3c0.2-0.3,0.5-0.6,0.7-0.8C432.5,174,433.1,172.1,432.8,170.1z M421.1,183.5c0,0,0.1,0,0.1,0C421.2,183.5,421.2,183.5,421.1,183.5C421.1,183.5,421.1,183.5,421.1,183.5z'/>
<path class='st5 heart two' d='M470.9,219.3c-0.3-1.8-1.2-3.3-2.5-4.6c-1.3-1.3-2.9-2.1-4.7-2.3c-0.4-0.1-0.8-0.1-1.3-0.1 c-3.1,0-6,1.7-7.5,4.4c-1.5-2.7-4.3-4.4-7.5-4.4c-0.4,0-0.8,0-1.3,0.1c-1.8,0.3-3.4,1.1-4.7,2.3c-1.3,1.3-2.2,2.9-2.5,4.6 c-0.5,2.7,0.3,5.4,2.2,7.4c0.3,0.3,0.6,0.7,0.9,1.1c0.1,0.1,0.2,0.2,0.3,0.3c2,2.3,6.5,6.6,9.5,9.3c0.7,0.7,1.7,1.1,2.7,1.1 c0.1,0,0.2,0,0.2,0c0.1,0,0.2,0,0.2,0c1,0,2-0.4,2.7-1.1c3-2.7,7.5-7,9.5-9.3c0.1-0.1,0.2-0.2,0.3-0.3c0.3-0.4,0.7-0.8,0.9-1.1 C470.5,224.7,471.3,222,470.9,219.3z M454.9,237.6c0.1,0,0.1,0,0.2,0C455,237.6,455,237.6,454.9,237.6 C454.9,237.6,454.9,237.6,454.9,237.6z'/>
</g>
</svg>
</a>
<h4 style='background: #fff;padding: 12px; display: block; font-size: 17px;'>
عفواً ، الصفحة التي تبحث عنها غير موجوده
</h4>
<style>
h4{color:$(keycolor);}
.st5{fill:#ED6245;}
.st6{fill:#0C5054;}
.st7{opacity:0.1;fill:#231F20;}
.st8{fill:#F6B344;}
.st9{fill:#F1E4C4;}
.st10{fill:#FFFFFF;}
.st11{fill:#231F20;}
.heart.one{
transform: translateY(300px);
opacity: 0;
animation:heart 8s 0s linear forwards infinite;
-o-animation:heart 8s 0s linear forwards infinite;
-moz-animation:heart 8s 0s linear forwards infinite;
-webkit-animation:heart 8s 0s linear forwards infinite;
}
.heart.two{
transform: translateY(300px);
opacity: 0;
animation:heart 8s .5s linear forwards infinite;
-o-animation:heart 8s .5s linear forwards infinite;
-moz-animation:heart 8s .5s linear forwards infinite;
-webkit-animation:heart 8s .5s linear forwards infinite;
}
.heart.three{
transform: translateY(300px);
opacity: 0;
animation:heart 8s 1s linear forwards infinite;
-o-animation:heart 8s 1s linear forwards infinite;
-moz-animation:heart 8s 1s linear forwards infinite;
-webkit-animation:heart 8s 1s linear forwards infinite;
}
.heart.four{
transform: translateY(300px);
opacity: 0;
animation:heart 8s 1.5s linear forwards infinite;
-o-animation:heart 8s 1.5s linear forwards infinite;
-moz-animation:heart 8s 1.5s linear forwards infinite;
-webkit-animation:heart 8s 1.5s linear forwards infinite;
}
.heart.five{
transform: translateY(200px);
opacity: 0;
animation:heart 8s 2s linear forwards infinite;
-o-animation:heart 8s 2s linear forwards infinite;
-moz-animation:heart 8s 2s linear forwards infinite;
-webkit-animation:heart 8s 2s linear forwards infinite;
}
@-webkit-keyframes heart{
0%{opacity: 0;}
10%{opacity: 1;}
100%{opacity: 1;transform: translateY(-600px)}
}
.eye{
animation:eye 10s 2s linear forwards ;
-o-animation:eye 10s 2s linear forwards ;
-moz-animation:eye 10s 2s linear forwards ;
-webkit-animation:eye 10s 2s linear forwards ;
}
@-webkit-keyframes eye{
0%{}
10%{transform: translateX(20px)}
20%{transform: translateX(20px)}
30%{transform: translateX(-20px)}
40%{transform: translateX(-20px)}
50%{transform: translateX(20px)translateY(-20px)}
60%{transform: translateX(20px)translateY(-20px)}
70%{transform: translateX(-20px)translateY(20px)}
80%{transform: translateX(-20px)translateY(20px)}
90%{transform: translateX(20px)}
100%{transform: translateX(0px)translateY(0px)}
}
body{
background-color: #fff;
text-align: center;
overflow:hidden;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.svg {
width: 420px;
max-width: 100%;
}
.ball1{
background: crimson;
width: 5px;
height: 5px;
}
.ball2{
background: lightgreen;
width: 20px;
height: 20px;
}
.ball3{
background: #ff00f5;
width: 15px;
height: 15px;
}
.ball4{
background: #0000ff;
width: 10px;
height: 10px;
}
.ball5{
background: #f5ff00;
width: 5px;
height: 5px;
}
.ball-effect{
animation: grow 0.5s linear forwards;
border-radius: 100%;
position: fixed;
z-index: 999999999;
}
div#changerColor {
display: none;
}
@keyframes grow {
0%{}
100%{
height: 100px;
width: 100px;
opacity: 0;
}
}
</style>
</b:if>
<b:if cond='data:blog.pageType != "error_page"'>
- وأخيرا ابحث عن الوسم </body>
- وضع فوقه مباشرة الكود التالي
</b:if>
لا تقرأ وترحل .. شارك قول رأيك
0 تعليقات: