إنشاء اقسام مثل دعم

السلام عليكم

ممكن شرح عمل مثل هذا 

مرحباً بك عزيزي
الكود بسيط

كود الHTML يتم وضعة في التومبلايت في قالب الفوتر

الكود:

<footer>Copyright ahlamontada.com</footer>

كود Css

الكود:

 footer {
    padding: 1em;
    color: white;
    background-color: black;
    clear: left;
    text-align: center;
}

ما بعد ذالك انت وأضافاتك ما تريد ان تضيف على الفوتر وتنسق وتعدل علية بما تشاء

مشكور اخي يجب علي شراء حق تعديل تومبلات

مشكور ممكن شرح بصور كيفيه وضع الكود

اهلا وسهلا بك
انت تريد قالب الفوتر كامل اليس كذالك
فلو سمحت وضح لي ماهي نسخة منتداك ليتم عمله
فيختلف نسخة من الثانية الى الثالثة او انفجن او punbb
بانتظارك ليتم عمله لك بالتومبلايت

هلا صديقي العزيز نسخه موقع الثالثة

اهلا وسهلا بك التعديل سيكون بقالبين ^_^
القالب الاول استبدله بدة
overall_footer_begin

الكود:


<!-- BEGIN html_validation -->
<div>
   <div>
      <div>
         <div>
            <div>
               <div>
                  <div>
                     <div>
<!-- END html_validation -->
                     </div>
                  </div>
               </div>
            </div>
            <div id="{ID_RIGHT}">
               <!-- BEGIN giefmod_index2 -->
               {giefmod_index2.MODVAR}
               <!-- BEGIN saut -->
               <div style="height:{SPACE_ROW}px"></div>
               <!-- END saut -->
               <!-- END giefmod_index2 -->
            </div>
         </div>
      </div>
   </div>
  <!-- Close Warpaper -->
</div>
<style>
/*FOOTER*/
#page-footer {
    background: #2E3133;
    clear: both;
    color: #A3AAAE;
    font-size: 10px;
    margin-top: 30px;
    min-width: 960px;
    padding-bottom: 60px;
    text-align: left;
}
#page-footer a {
    color: #A3AAAE;
}
  #page-footer a:hover {

color: #CCD0D2;
}
  #footerBackToTop a:hover {
    background: #1E2123;
}
#footer-container {
    margin: 0 auto;
    padding: 0 15px;
    width: 90%;
}
.footer-col {
    float: right;
    width: 25%;
}
.footer-title {
    display: block;
    font-size: 14px;
    margin: 60px 0 25px;
    text-transform: uppercase;
  text-align: right;
}
.footer-list {
    list-style: none;
    margin: 0 0 10px;
    padding-right: 0;
}
.footer-list li {
    margin-bottom: 10px;
    text-align: right;
}

.clear {
    background: transparent;
    clear: both;
    display: block;
    font-size: 1px;
    line-height: 1px;
}
.footer-row hr {
    border: none;
    border-top: 2px solid #FFF!important;
    margin: 40px auto 0;
    width: 100px;
}
.footer-copyright {
    padding-top: 20px;
    text-align: center;
    opacity: .5;
    transition: 300ms;
}
  .footer-copyright:hover {
    opacity: 1;
}
#footer_brand {
    display: block;
    margin: 0 auto;
    width: 230px;
}
#footer_brand span {
    color: #FFF;
    display: inline-block;
    margin: 10px;
}
#footerBackToTop {
    position: relative;
}

#footerBackToTop a {
    background: #3E4143;
    border-radius: 30px;
    display: inline-block;
    height: 30px;
    left: 50%;
    margin-left: -15px;
    position: absolute;
    top: 10px;
    width: 30px;
}
#footerBackToTop a img {
    margin-top: 9px;
}
li#default-footer a.small {
    color: #FF9!important;
}
li#default-footer .gensmall {
    display: none !important;
}
</style>
<div class="clear"></div>
<div class="clear"></div>
 
</div>
<a href="#" id="bottom" name="bottom"></a>
<div id="page-footer">
  <div id="footer-container">
    <div class="footer-row">
      <div class="footer-col">
        <strong class="footer-title">اسم منتداك</strong>
        <ul class="footer-list">
    <li><a href="#">فرق المنتدي</a></li>
          <li><a href="#">رتب الاعضاء</a></li>
          <li><a href=#">القانون العام</a></li>
        </ul>
      </div>
      <div class="footer-col">
        <strong class="footer-title">خدماتنا</strong>
        <ul class="footer-list">
          <li><a href="#">رابط نصي</a></li>
          <li><a href="#">رابط نصي</a></li>
        </ul>
      </div>
     
      <div class="footer-col">
        <strong class="footer-title">تابعنا</strong>
        <ul class="footer-list">
          <li><a href="https://www.facebook.com/cocssegypt"><span style="font-family: FontAwesome;font-size: 14px;"></span> الفيس بوك</a></li>
          <li><a href="http://youtube.com/c/ClashOfClansSarcasmSociety"><span style="font-family: FontAwesome;font-size:14px;"></span> اليوتيوب</a></li>
 
            </ul>
          </div>
          <div class="footer-col">
          <strong class="footer-title">معلومات اضافية</strong>
            <ul class="footer-list">
              <li id="default-footer">         
<!-- BEGIN html_validation -->
              </li>
            </ul>
     </div>
      </div>
  </div>
</div>
<!-- END html_validation -->


سجل ثم انشر ^_^
القالب الثاني هو
overall_footer_end
استبدلهه بدة واسجل وانشر

الكود:


<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
   <div>
      <div>
         <div>
            <div>
               <div>
                  <div>
                     <ul>
                        <li>
<!-- END html_validation -->
                        </li>
                     </ul>
                        </li>
                     </ul>
                  </div>
               </div>
               <p class="copyright">
                  <strong>{ADMIN_LINK}</strong>
               </p>
                                  </div>
          <a href="#bottom" name="bottom"></a>
                          <div class="clear"></div>
          <div class="footer-row">
            <hr>
              <div class="footer-copyright">
                <strong></strong>
                <a id="footer_brand" href="/"><span>منتديات تقنيات</span><div>
                  <img src="https://i97.servimg.com/u/f97/16/46/77/76/icon_f10.png" alt="http://www.t3qnyiat.com/"></div>
                  <span>© 2016,t3qnyiat</span></a>
                  <div id="footerBackToTop">
 
      <a href="#top"><img src="https://i21.servimg.com/u/f21/18/45/41/65/top10.png" alt="^"></a>
                    </div>
                  </div>
                </div>
            {PROTECT_FOOTER}
                         
         </div>
      </div>
   </div>
</div>
                </div>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
    FB.init({
      appId      : {switch_facebook_login.FACEBOOK_APP_ID},
      cookie    : true,
      xfbml      : true,
      oauth      : true,
      version    : 'v2.3'
    });
 
  (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
   if ($('a#logout'))
   {
      var lien_redir = $('a#logout').attr('href');
 
      if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
      {
         document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
      }
   }
});
 
$(document).ready( function() {
   $('a#logout').click( function() {
      FB.logout();
   } );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
 
<script type="text/javascript">
//<![CDATA[
   fa_endpage();
//]]>
</script>
</body>
</html>



JAR7 كتب:اهلا وسهلا بك التعديل سيكون بقالبين ^_^
القالب الاول استبدله بدة
overall_footer_begin

الكود:


<!-- BEGIN html_validation -->
<div>
 <div>
 <div>
 <div>
 <div>
 <div>
 <div>
 <div>
<!-- END html_validation -->
 </div>
 </div>
 </div>
 </div>
 <div id="{ID_RIGHT}">
 <!-- BEGIN giefmod_index2 -->
 {giefmod_index2.MODVAR}
 <!-- BEGIN saut -->
 <div style="height:{SPACE_ROW}px"></div>
 <!-- END saut -->
 <!-- END giefmod_index2 -->
 </div>
 </div>
 </div>
 </div>
  <!-- Close Warpaper -->
</div>
<style>
/*FOOTER*/
#page-footer {
    background: #2E3133;
    clear: both;
    color: #A3AAAE;
    font-size: 10px;
    margin-top: 30px;
    min-width: 960px;
    padding-bottom: 60px;
    text-align: left;
}
#page-footer a {
    color: #A3AAAE;
}
  #page-footer a:hover {

color: #CCD0D2;
}
  #footerBackToTop a:hover {
    background: #1E2123;
}
#footer-container {
    margin: 0 auto;
    padding: 0 15px;
    width: 90%;
}
.footer-col {
    float: right;
    width: 25%;
}
.footer-title {
    display: block;
    font-size: 14px;
    margin: 60px 0 25px;
    text-transform: uppercase;
  text-align: right;
}
.footer-list {
    list-style: none;
    margin: 0 0 10px;
    padding-right: 0;
}
.footer-list li {
    margin-bottom: 10px;
    text-align: right;
}

.clear {
    background: transparent;
    clear: both;
    display: block;
    font-size: 1px;
    line-height: 1px;
}
.footer-row hr {
    border: none;
    border-top: 2px solid #FFF!important;
    margin: 40px auto 0;
    width: 100px;
}
.footer-copyright {
    padding-top: 20px;
    text-align: center;
    opacity: .5;
    transition: 300ms;
}
  .footer-copyright:hover {
    opacity: 1;
}
#footer_brand {
    display: block;
    margin: 0 auto;
    width: 230px;
}
#footer_brand span {
    color: #FFF;
    display: inline-block;
    margin: 10px;
}
#footerBackToTop {
    position: relative;
}

#footerBackToTop a {
    background: #3E4143;
    border-radius: 30px;
    display: inline-block;
    height: 30px;
    left: 50%;
    margin-left: -15px;
    position: absolute;
    top: 10px;
    width: 30px;
}
#footerBackToTop a img {
    margin-top: 9px;
}
li#default-footer a.small {
    color: #FF9!important;
}
li#default-footer .gensmall {
    display: none !important;
}
</style>
<div class="clear"></div>
<div class="clear"></div>
 
</div>
<a href="#" id="bottom" name="bottom"></a>
<div id="page-footer">
  <div id="footer-container">
    <div class="footer-row">
      <div class="footer-col">
        <strong class="footer-title">اسم منتداك</strong>
        <ul class="footer-list">
    <li><a href="#">فرق المنتدي</a></li>
          <li><a href="#">رتب الاعضاء</a></li>
          <li><a href=#">القانون العام</a></li>
        </ul>
      </div>
      <div class="footer-col">
        <strong class="footer-title">خدماتنا</strong>
        <ul class="footer-list">
          <li><a href="#">رابط نصي</a></li>
          <li><a href="#">رابط نصي</a></li>
        </ul>
      </div>
      
      <div class="footer-col">
        <strong class="footer-title">تابعنا</strong>
        <ul class="footer-list">
          <li><a href="https://www.facebook.com/cocssegypt"><span style="font-family: FontAwesome;font-size: 14px;"></span> الفيس بوك</a></li>
          <li><a href="http://youtube.com/c/ClashOfClansSarcasmSociety"><span style="font-family: FontAwesome;font-size:14px;"></span> اليوتيوب</a></li>
 
            </ul>
          </div>
          <div class="footer-col">
          <strong class="footer-title">معلومات اضافية</strong>
             <ul class="footer-list">
               <li id="default-footer">
<!-- BEGIN html_validation -->
               </li>
             </ul>
  </div>
      </div>
  </div>
</div>
<!-- END html_validation -->


سجل ثم انشر ^_^
القالب الثاني هو
overall_footer_end
استبدلهه بدة واسجل وانشر

الكود:


<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
 <div>
 <div>
 <div>
 <div>
 <div>
 <div>
 <ul>
 <li>
<!-- END html_validation -->
 </li>
 </ul>
 </li>
 </ul>
 </div>
 </div>
 <p class="copyright">
 <strong>{ADMIN_LINK}</strong>
 </p>
                                  </div>
          <a href="#bottom" name="bottom"></a>
                          <div class="clear"></div>
          <div class="footer-row">
            <hr>
              <div class="footer-copyright">
                <strong></strong>
                <a id="footer_brand" href="/"><span>منتديات تقنيات</span><div>
                  <img src="https://i97.servimg.com/u/f97/16/46/77/76/icon_f10.png" alt="http://www.t3qnyiat.com/"></div>
                  <span>© 2016,t3qnyiat</span></a>
                  <div id="footerBackToTop">
  
      <a href="#top"><img src="https://i21.servimg.com/u/f21/18/45/41/65/top10.png" alt="^"></a>
                    </div>
                  </div>
                </div>
 {PROTECT_FOOTER}
                          
 </div>
 </div>
 </div>
</div>
                </div>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
    FB.init({
      appId      : {switch_facebook_login.FACEBOOK_APP_ID},
      cookie     : true,
      xfbml      : true,
      oauth      : true,
      version    : 'v2.3'
    });
 
  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
 if ($('a#logout'))
 {
 var lien_redir = $('a#logout').attr('href');
 
 if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
 {
 document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
 }
 }
});
 
$(document).ready( function() {
 $('a#logout').click( function() {
 FB.logout();
 } );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
 
<script type="text/javascript">
//<![CDATA[
 fa_endpage();
//]]>
</script>
</body>
</html>



مشكوررررررررررر ياغالي ماقصرت