كنت قد وضعت موضوع بالسابق بعنوان
تركيب تأثير متحرك
اما في هذا الموضوع نفس الاضافة انما ثابتة لا تتحرك
شرح التركيب
يمكنكم متابعة الفيديو بالموضوع السابق لطريقة التركيب
اكواد الاضافة
نذهب الى المظهر و نبحث عن ]]></b:skin>
و نلصق الكود التالي فوقه/* Footer Gelombang */#fancy-shape{clear:both;max-width:100%;display:block;position:relative;margin:15% auto 0;justify-content:center;z-index:2;box-sizing:border-box}.footer-fancy-shape{clear:both;overflow:hidden;position:absolute;left:0;bottom:100%;width:100%;margin-bottom:-2px;direction:ltr}.footer-fancy-shape[data-negative=false].footer-fancy-shape-bottom,.footer-fancy-shape[data-negative=true].footer-fancy-shape-top{transform:rotate(180deg)}@media screen and (max-width:992px){.footer-fancy-shape-bottom svg{height:105px}}.footer-fancy-shape-bottom svg{width:calc(130% + 2.5px);height:125px}.footer-fancy-shape .footer-fancy-shape-fill{fill:#1a73e8;width:calc(100% + 2.5px);transform:rotateY(0deg);-webkit-transform-origin:center;transform-origin:center;transition:all .5s ease}.footer-fancy-shape svg{z-index:-1;display:block;position:relative;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%)}@media screen and (max-width: 992px){.footer-fancy-shape-bottom svg{height:105px}}@media screen and (max-width: 768px){.footer-fancy-shape-bottom svg{height:85px}}@media screen and (max-width: 480px){.footer-fancy-shape-bottom svg{height:55px}}#footer-navmenu{background:#1a73e8;padding:25px 0;font:$(navmenufooter.font);color:$(navmenufooter.color)}#footer-container{background:#1a73e8;padding:20px 5px;overflow:hidden;color:$(footer.color);font-size:12px;text-align:center;border-top:2px solid #1559b38f}
ثم نضع الكود التالي فوق الفوتر
<div id='fancy-shape'> <section class='footer-fancy-shape footer-fancy-shape-bottom' data-negative='false'> <svg preserveAspectRatio='none' viewBox='0 0 1000 100' xmlns='http://www.w3.org/2000/svg'> <path class='fancy-shape1 footer-fancy-shape-fill' d='M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z' opacity='0.33'/> <path class='fancy-shape2 footer-fancy-shape-fill' d='M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z' opacity='0.66'/> <path class='fancy-shape3 footer-fancy-shape-fill' d='M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z'/> </svg> </section> <div id='bf-fancy-icon'> <div class='footer-shape footer-fancy-logo' data-negative='false'> </div> </div> </div>
و نقوم بالحفظ