# تنظیم تصویر شناور برای به صورت ثابت در تمام صفحات وب سایت

**URL:** <https://forums.7ho.st/t/%D8%AA%D9%86%D8%B8%DB%8C%D9%85-%D8%AA%D8%B5%D9%88%DB%8C%D8%B1-%D8%B4%D9%86%D8%A7%D9%88%D8%B1-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%A8%D9%87-%D8%B5%D9%88%D8%B1%D8%AA-%D8%AB%D8%A7%D8%A8%D8%AA-%D8%AF%D8%B1-%D8%AA%D9%85%D8%A7%D9%85-%D8%B5%D9%81%D8%AD%D8%A7%D8%AA-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA/4691>\
**Category:** وردپرس\
**Tags:** وردپرس, سی-پنل, افزونه\
**Created:** [اوت 10، 2020، 2:44ب.ظ UTC](https://forums.7ho.st/t/%D8%AA%D9%86%D8%B8%DB%8C%D9%85-%D8%AA%D8%B5%D9%88%DB%8C%D8%B1-%D8%B4%D9%86%D8%A7%D9%88%D8%B1-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%A8%D9%87-%D8%B5%D9%88%D8%B1%D8%AA-%D8%AB%D8%A7%D8%A8%D8%AA-%D8%AF%D8%B1-%D8%AA%D9%85%D8%A7%D9%85-%D8%B5%D9%81%D8%AD%D8%A7%D8%AA-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA/4691 "2020-08-10T14:44:16Z")\
**Posts on this page:** 1\
**Showing post:** 10

<div class="post-metadata">

**Author:** ![Meysam\_Kiani](https://forums.7ho.st/user_avatar/forums.7ho.st/meysam_kiani/32/2273_2.png) [@Meysam\_Kiani](https://forums.7ho.st/u/Meysam_Kiani)\
**Post date:** [اوت 12، 2020، 8:44ق.ظ UTC](https://forums.7ho.st/t/%D8%AA%D9%86%D8%B8%DB%8C%D9%85-%D8%AA%D8%B5%D9%88%DB%8C%D8%B1-%D8%B4%D9%86%D8%A7%D9%88%D8%B1-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%A8%D9%87-%D8%B5%D9%88%D8%B1%D8%AA-%D8%AB%D8%A7%D8%A8%D8%AA-%D8%AF%D8%B1-%D8%AA%D9%85%D8%A7%D9%85-%D8%B5%D9%81%D8%AD%D8%A7%D8%AA-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA/4691/10 "2020-08-12T08:44:00Z")

</div>

سلام خوب هستید این کدهایی که تقدیمتون میکنم رو ازشون استفاده کنید. نکته اول باید بخش html رو درست کنید نکته دوم هم باید بخش css :  
**بخش HTML :**

```
<div class="fixedbox">
    <div class="reldiv">
        <h6>آیا به مشاوره نیاز دارید؟</h6>
  </div>

```

**نکته : میتونید اینجا عکس قرار بدید یا اینکه متن یا هرچیزی که دوست دارید.**

بخش CSS :

```
.fixedbox {
    font-family: tahoma;
    background: #ffffff;
    border-radius: 5px;
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 100%;
    border: 1px solid #D9DEE1;
    z-index: 100;
    text-align: center;
}
.fixedbox .reldiv {
    padding: 20px;
}

.fixedbox h6 {
    font: 500 12pt/18px tahoma;
    border-bottom: 1px solid #D9DEE1;
    color: #526066;
    padding: 0 0 15px 0;
    margin: 0;
    text-align: center;
}
.fixedbox p {
    color: #333;
    font: 500 11pt/18px tahoma;
    margin: 20px 0 0px 0;
    text-align: center;
}

```

خب تا به اینجا ما یه همچین چیزی پایین صفحه اضافه کردیم :  
 ![Capture](https://forums.7ho.st/uploads/default/original/2X/b/b1b77a741b0d4e97bdc99c893c01ef5e77c60008.png)

بخش مورد نظر شما که میخوایین گزینه حذف رو هم داشته باشه باید. این بخش رو باید بعد از بخش html وارد کنید :

```
function hide() {
document.getElementById("imgbox2").style.visibility = "hidden";
}

```

**کد نهایی به این صورت هست.**  
کد HTML : (میتوانید در بخش هدر یا فوتر سایت قرار بدید)

```
<div class="fixedbox" id="imgbox2">
  <button onclick="hide()" style="float: left; ">Close</button>
  <div> </div>
    <div class="reldiv">
        <h6>آیا به مشاوره نیاز دارید؟</h6> 
  </div>
  <script> 
  function hide() {
    document.getElementById("imgbox2").style.visibility = "hidden";
}
</script>

```

**کد CSS**

```
.fixedbox {
    font-family: tahoma;
    background: #ffffff;
    border-radius: 5px;
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 100%;
    border: 1px solid #D9DEE1;
    z-index: 100;
    text-align: center;
}
.fixedbox .reldiv {
    padding: 20px;
}

.fixedbox h6 {
    font: 500 12pt/18px tahoma;
    border-bottom: 1px solid #D9DEE1;
    color: #526066;
    padding: 0 0 15px 0;
    margin: 0;
    text-align: center;
}
.fixedbox p {
    color: #333;
    font: 500 11pt/18px tahoma;
    margin: 20px 0 0px 0;
    text-align: center;
}

.imgbox {
 text-align: left;
 width: 200px;
 border: 2px solid #607D8B;
 margin: 5px;
 padding: 6px;
 height:80px;
 overflow:hidden;
}

```

موفق باشید

---

_[View the full topic](https://forums.7ho.st/t/%D8%AA%D9%86%D8%B8%DB%8C%D9%85-%D8%AA%D8%B5%D9%88%DB%8C%D8%B1-%D8%B4%D9%86%D8%A7%D9%88%D8%B1-%D8%A8%D8%B1%D8%A7%DB%8C-%D8%A8%D9%87-%D8%B5%D9%88%D8%B1%D8%AA-%D8%AB%D8%A7%D8%A8%D8%AA-%D8%AF%D8%B1-%D8%AA%D9%85%D8%A7%D9%85-%D8%B5%D9%81%D8%AD%D8%A7%D8%AA-%D9%88%D8%A8-%D8%B3%D8%A7%DB%8C%D8%AA/4691)._