الرئيسية
انشاء منتدى مجانياضف إيموجي بعد الضغط على ازرار التفاعل
صفحة 1 من اصل 1
اضف إيموجي بعد الضغط على ازرار التفاعل
من طرف كونان2000 25/07/22, 05:28 am
السلام عليكم ورحمة الله وبركاتة
سيساعدك هذا الكود على إظهار رمز تعبيري بعد الضغط على أزرار التفاعل,
يظهر الرمز اسفل الموضوع
كما في المثال أدناه.
----------------------------------
يظهر الرمز اسفل الموضوع
كما في المثال أدناه.
----------------------------------
بعد الضغط على زر "أعجبني" ، سيظهر هذا الرمز التعبيري >
زر لم يعجبني >>
زر زائد >>>
زر ناقص >
------------------------------------------
طريقة التركيب
- phpBB2:
ابحث عن الكود التالي في قالب viewtopic_body- الكود:
<div>{postrow.displayed.MESSAGE}</div>
احذفه وضع مكانه الكود التالي- الكود:
<div>{postrow.displayed.MESSAGE}</div>
<style>
.fa_likee_div p.fa_like_list, .fa_likee_div p.fa_dislike_list {
background: #0c121200;
line-height: 0px;
padding: 0;
}
.fa_likee_div {
line-height: 0px;
}
.vote-post a {
font-size: 0 !important;
}
.fa_like_list, .fa_dislike_list, .option_voters_list {
font-size: larger;
}
.vote-post {
line-height: 0px;
border-radius: 100px;
background: #dfd6d6;
margin-top: 100px;
display: flex;
justify-content: center;
width: fit-content;
}
p.fa_dislike_list img, p.fa_like_list img {
width: 50px;
}
p.fa_like_list:before {
padding-right: 8px;
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a19.png);
}
p.fa_dislike_list:before {
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a20.png);
}
.fa-dislike, .fa-like {
font-size: 0 !important;
float: right;
}
.fa-dislike {
padding-right: 10px;
}
.fa_like_div p.fa_like_list:before, .fa_like_div p.fa_dislike_list:before {
font-size: 0 !important;
border: 0 !important;
display: none;
}
.fa_like_list, .fa_dislike_list {
border: 0 !important;
}
.vote-post-Message img {
width: 52px !important;
}
.vote-post-Message {
width: 70px!important;
}
</style>
<div align="center"><div class="vote-post" style="font-size: 0px;">
<!-- BEGIN switch_vote_active -->
<!-- BEGIN switch_bar -->
<!-- BEGIN switch_vote_plus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a17.png" />
</div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a18.png" />
</div>
<!-- END switch_vote_minus -->
<!-- END switch_bar -->
<!-- END switch_vote_active -->
<!-- BEGIN switch_likes_active -->
<div class="fa_likee_div" style="font-size: 0px;">
<!-- BEGIN switch_like_list -->
<div class="fa-like" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}</div>
<!-- END switch_like_list -->
<!-- BEGIN switch_dislike_list -->
<div class="fa-dislike" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}</div>
<!-- END switch_dislike_list -->
</div>
<!-- END switch_likes_active -->
</div> </div>
- AwesomeBB:
- _______________________________
ابحث عن الكود التالي في قالب viewtopic_body- الكود:
{postrow.displayed.MESSAGE}
احذفه وضع مكانه الكود التالي- الكود:
<div>{postrow.displayed.MESSAGE}</div>
<style>
.fa_likee_div {
position: relative;
top: -5px;
}
.vote-post a {
font-size: 0 !important;
}
.fa_like_list, .fa_dislike_list, .option_voters_list {
font-size: larger;
}
.vote-post {
border-radius: 100px;
background: #dfd6d6;
margin-top: 100px;
display: flex;
justify-content: center;
width: fit-content;
}
p.fa_dislike_list img, p.fa_like_list img {
width: 50px;
}
p.fa_like_list:before {
padding-right: 8px;
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a19.png);
}
p.fa_dislike_list:before {
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a20.png);
}
.fa-dislike, .fa-like {
font-size: 0 !important;
float: right;
}
.fa-dislike {
padding-right: 10px;
}
.fa_like_div p.fa_like_list:before, .fa_like_div p.fa_dislike_list:before {
font-size: 0 !important;
border: 0 !important;
display: none;
}
.fa_like_list, .fa_dislike_list {
border: 0 !important;
}
.fa-like {
padding-left: 1px;
position: relative;
bottom: -1px;
}
.vote-post-Message img {
width: 52px !important;
}
.vote-post-Message {
width: 70px!important;
}
</style>
<div align="center"><div class="vote-post" style="font-size: 0px;">
<!-- BEGIN switch_vote_active -->
<!-- BEGIN switch_bar -->
<!-- BEGIN switch_vote_plus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a17.png" />
</div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a18.png" />
</div>
<!-- END switch_vote_minus -->
<!-- END switch_bar -->
<!-- END switch_vote_active -->
<!-- BEGIN switch_likes_active -->
<div class="fa_likee_div" style="font-size: 0px;">
<!-- BEGIN switch_like_list -->
<div class="fa-like" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}</div>
<!-- END switch_like_list -->
<!-- BEGIN switch_dislike_list -->
<div class="fa-dislike" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}</div>
<!-- END switch_dislike_list -->
</div>
<!-- END switch_likes_active -->
</div> </div>
----
- ModernBB:
- _______________________________
ابحث عن الكود التالي في قالب viewtopic_body- الكود:
<div>{postrow.displayed.MESSAGE}</div>
احذفه وضع مكانه الكود التالي- الكود:
<div>{postrow.displayed.MESSAGE}</div>
<style>
.fa_likee_div {
position: relative;
top: -5px;
}
.vote-post a {
font-size: 0 !important;
}
.fa_like_list, .fa_dislike_list, .option_voters_list {
font-size: larger;
}
.vote-post {
border-radius: 100px;
background: #dfd6d6;
margin-top: 100px;
display: flex;
justify-content: center;
width: fit-content;
}
p.fa_dislike_list img, p.fa_like_list img {
width: 50px;
}
p.fa_like_list:before {
padding-right: 8px;
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a19.png);
}
p.fa_dislike_list:before {
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a20.png);
}
.fa-dislike, .fa-like {
font-size: 0 !important;
float: right;
}
.fa-dislike {
padding-right: 10px;
}
.fa_like_div p.fa_like_list:before, .fa_like_div p.fa_dislike_list:before {
font-size: 0 !important;
border: 0 !important;
display: none;
}
.fa_like_list, .fa_dislike_list {
border: 0 !important;
}
.fa-like {
padding-left: 1px;
position: relative;
bottom: -1px;
}
.vote-post-Message img {
width: 52px !important;
}
.vote-post-Message {
width: 70px!important;
}
</style>
<div align="center"><div class="vote-post" style="font-size: 0px;">
<!-- BEGIN switch_vote_active -->
<!-- BEGIN switch_bar -->
<!-- BEGIN switch_vote_plus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a17.png" />
</div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a18.png" />
</div>
<!-- END switch_vote_minus -->
<!-- END switch_bar -->
<!-- END switch_vote_active -->
<!-- BEGIN switch_likes_active -->
<div class="fa_likee_div" style="font-size: 0px;">
<!-- BEGIN switch_like_list -->
<div class="fa-like" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}</div>
<!-- END switch_like_list -->
<!-- BEGIN switch_dislike_list -->
<div class="fa-dislike" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}</div>
<!-- END switch_dislike_list -->
</div>
<!-- END switch_likes_active -->
</div> </div>
----
- PunBB و Invision و phpBB3 :
- _______________________________
ابحث عن الكود التالي في قالب viewtopic_body- الكود:
<div>{postrow.displayed.MESSAGE}</div>
احذفه وضع مكانه الكود التالي- الكود:
<div>{postrow.displayed.MESSAGE}</div>
<style>
.vote-post a {
font-size: 0 !important;
}
.fa_like_list, .fa_dislike_list, .option_voters_list {
font-size: larger;
}
.vote-post {
border-radius: 100px;
background: #dfd6d6;
margin-top: 100px;
display: flex;
justify-content: center;
width: fit-content;
}
p.fa_dislike_list img, p.fa_like_list img {
width: 50px;
}
p.fa_like_list:before {
padding-right: 8px;
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a19.png);
}
p.fa_dislike_list:before {
content: url(https://i.servimg.com/u/f20/16/85/77/67/ocia-a20.png);
}
.fa-dislike, .fa-like {
font-size: 0 !important;
float: right;
}
.fa-dislike {
padding-right: 10px;
}
.fa_like_div p.fa_like_list:before, .fa_like_div p.fa_dislike_list:before {
font-size: 0 !important;
border: 0 !important;
display: none;
}
.fa_like_list, .fa_dislike_list {
border: 0 !important;
}
.fa-like {
padding-left: 1px;
position: relative;
bottom: -1px;
}
.vote-post-Message img {
width: 52px !important;
}
.vote-post-Message {
width: 70px!important;
}
</style>
<div align="center"><div class="vote-post" style="font-size: 0px;">
<!-- BEGIN switch_vote_active -->
<!-- BEGIN switch_bar -->
<!-- BEGIN switch_vote_plus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a17.png" />
</div>
<!-- END switch_vote_plus -->
<!-- BEGIN switch_vote_minus -->
<div class="vote-post-Message" style="width:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;">
<img src="https://i.servimg.com/u/f20/16/85/77/67/ocia-a18.png" />
</div>
<!-- END switch_vote_minus -->
<!-- END switch_bar -->
<!-- END switch_vote_active -->
<!-- BEGIN switch_likes_active -->
<div class="fa_likee_div" style="font-size: 0px;">
<!-- BEGIN switch_like_list -->
<div class="fa-like" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_like_list.D_LIKE_LIST}</div>
<!-- END switch_like_list -->
<!-- BEGIN switch_dislike_list -->
<div class="fa-dislike" style="font-size: 0px;">{postrow.displayed.switch_likes_active.switch_dislike_list.D_DISLIKE_LIST}</div>
<!-- END switch_dislike_list -->
</div>
<!-- END switch_likes_active -->
</div> </div>
________________________________
نأمل أن يعجبك هذا الكود 
-----------------
-----------------
لا تتردد في فتح موضوع ع إذا كان لديك أي خلل أو عيب قد تكون قد رصدته 
وفقكم الله
________________________
تمت كتابة الأكواد والشرح بواسطة كونان2000
وشكرا للعضو العراقي الطائي الذي بسببه جاءتني هذه الفكرة الجميلة
كونان2000- احلى نائب
-
عدد المساهمات : 1528
معدل النشاط : 3223
السُمعة : 229 -
abigan, العراقي الطائي و Mr Google يعجبهم هذا الموضوع
مواضيع مماثلة» جديد : إضافة رموز تعبيرية "إيموجي" في محرر الكتابة
» كيف احصل كود التفاعل
» ارجو التفاعل
» كيف اعمل شريط التفاعل؟
» شرح كامل لكيفية الإشتراك و التفاعل بخدمة Google Analytics
» كيف احصل كود التفاعل
» ارجو التفاعل
» كيف اعمل شريط التفاعل؟
» شرح كامل لكيفية الإشتراك و التفاعل بخدمة Google Analytics
صفحة 1 من اصل 1
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى
Facebook
Twitter
Youtube
