أهلا بجميع زوار وأعضاء منتدى التطوير واب
كما سبق وتم وعدكم بوضع جميع أكوادنا التي تعجبكم لكم هنا بالمجان, فلقد وفينا بوعدنا ولا خير في كاتم العلم.
شرحنا اليوم هو طريقة وضع كود الأحصائيات الخاص بمنتدى أشهار سابقآ.
للمعاينة عبر صورة للكود:-
الكود الأول*
https://i.servimg.com/u/f43/13/93/90/70/eshary12.png
الكود الثاني*
https://i.servimg.com/u/f43/13/93/90/70/eshary13.png
الأن نأتي للشرح:-
خاص فقط بالكود الأول*
https://i.servimg.com/u/f43/13/93/90/70/eshary12.png
لوحة الاداره >> مظهر المنتدى >> التومبلايت >> إدارة عامة
index_body
وأبحث عن:
الرمز:
<!-- BEGIN disable_viewonline -->
الى غاية:
الرمز:
<!-- END disable_viewonline -->
وأحذفة كله وضع هذا الكود بدالة:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, حمل الكود:
رابط التحميل
http://www.mediafire.com/download.php?qysydr8rir2wq6b
ثم سجل
ثم ندخل
لوحة الاداره >> مظهر المنتدى >> ألوان >> ورقة تصميم css
ونضع هذا الكود:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, تفضل الكود:
/*----- الأحصائيات -----*/
.tout_qeel{
padding: 5px;
}
.group{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
font-size : 12px;
display: inline;
/position: relative;
padding: 3px;
margin-right: 50px;
-moz-border-radius: 7px 7px 0px 0px ;
-webkit-border-radius: 7px 7px 0px 0px ;
border-radius:7px 7px 0px 0px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
.group:hover, .group2:hover {
font-size: 12px;
border-left : medium solid #3896B5;
border-right : medium solid #3896B5;
}
a.infobulle_rang, a.infobulle_range{
position: relative;
}
a.infobulle_rang em, a.infobulle_range em {
display:none;
}
a.infobulle_rang:hover, a.infobulle_range:hover{
border: 0;
z-index: 999;
}
a.infobulle_rang:hover em {
font-style: normal;
display: inline;
position: absolute;
top: 20px;
right:-50px;
padding: 2px;
-moz-border-radius: 3px 7px 3px 7px ;
-webkit-border-radius: 3px 7px 3px 7px ;
border-radius:3px 7px 3px 7px ;
border:1px solid #c8c092;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background:rgba(247,239,196,0.9);
width:200px;
}
a.infobulle_range:hover em {
font-style: normal;
display: inline;
position: absolute;
bottom: 20px;
right:-70px;
padding: 2px;
-moz-border-radius: 3px 7px 3px 7px ;
-webkit-border-radius: 3px 7px 3px 7px ;
border-radius:3px 7px 3px 7px ;
border:1px solid #c8c092;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background:rgba(247,239,196,0.9);
width:200px;
}
.rotation:hover{
-moz-transform: rotate(-15deg);
-webkit-transform: rotate(-15deg);
}
.gauche{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
vertical-alignement: middle;
margin:0px;
padding: 6px;
-moz-border-radius:50px 0px 50px 0px;
-webkit-border-radius:50px 0px 50px 0px;
border-radius:50px 0px 50px 0px;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
div.info_gauche em {
display:none;
}
div.info_gauche:hover {
z-index: 999;
cursor: hand;
position: relative;
border: 0;
}
div.info_gauche:hover em {
font-style: normal;
font-size: 13px;
color:#000;
padding: 3px;
display: inline;
position: absolute;
top: 12px;
left: 7px;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background: transparent url(https://i.servimg.com/u/f65/11/95/30/70/231.png) repeat 0 0;
background:rgba(247,239,196,0.9);
width:90%;
}
.rotation-d:hover{
-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg);
}
.droite{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
vertical-alignement: middle;
margin:0px;
padding: 6px;
-moz-border-radius:0px 50px 0px 50px;
-webkit-border-radius:0px 50px 0px 50px;
border-radius:0px 50px 0px 50px;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
div.info_droite em {
display:none;
}
div.info_droite:hover {
z-index: 999;
cursor: hand;
position: relative;
border: 0;
}
div.info_droite:hover em {
font-style: normal;
font-size: 13px;
color:#000;
padding: 3px;
display: inline;
position: absolute;
top: 10px;
right:7px;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background: transparent url(https://i.servimg.com/u/f65/11/95/30/70/231.png) repeat 0 0;
background:rgba(247,239,196,0.9);
width:90%;
}
.texte_rotation{
float: left;
margin-top: -140px;
margin-left: 270px;
padding: 3px;
color: #000;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 7px 0px ;
-webkit-border-radius: 7px 7px 7px 0px ;
border-radius:7px 7px 7px 0px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#FFFFFF', Direction=140, Strength=2);
zoom: 1;
-moz-transform: rotate(40deg);
-webkit-transform: rotate(40deg);
background:rgba(247,239,196,0.9);
}
.texte_rotation_2{
float: right;
margin-top: -135px;
margin-right: 280px;
padding: 3px;
color: #000;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#FFFFFF', Direction=140, Strength=2);
zoom: 1;
-moz-transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
background:rgba(247,239,196,0.9);
}
.texte_rotation_2:hover, .texte_rotation:hover{
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color=' #FFFFFF', Direction=140, Strength=2);
zoom: 1;
}
.group2 {
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
font-size : 12px;
display: inline;
/position: relative;
float: left;
padding: 3px;
margin-left:50px;
margin-top:-2px;
-moz-border-radius: 0px 0px 7px 7px ;
-webkit-border-radius: 0px 0px 7px 7px ;
border-radius:0px 0px 7px 7px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
ثم سجل
خاص فقط بالكود الثاني*
اقتباس :https://i.servimg.com/u/f43/13/93/90/70/eshary13.png
لوحة الاداره >> مظهر المنتدى >> التومبلايت >> إدارة عامة
index_body
وأبحث عن:
الرمز:
<!-- BEGIN disable_viewonline -->
الى غاية:
الرمز:
<!-- END disable_viewonline -->
وأحذفة كله وضع هذا الكود بدالة:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, حمل الكود:
رابط التحميل
http://www.mediafire.com/download.php?4dyv9kfpl553gh8
ثم سجل
ثم ندخل
لوحة الاداره >> مظهر المنتدى >> ألوان >> ورقة تصميم css
ونضع هذا الكود:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
ثم سجل
أنتهى شرحنا لكيفيةوضع كود الأحصائيات
كما سبق وتم وعدكم بوضع جميع أكوادنا التي تعجبكم لكم هنا بالمجان, فلقد وفينا بوعدنا ولا خير في كاتم العلم.
شرحنا اليوم هو طريقة وضع كود الأحصائيات الخاص بمنتدى أشهار سابقآ.
للمعاينة عبر صورة للكود:-
الكود الأول*
https://i.servimg.com/u/f43/13/93/90/70/eshary12.png
الكود الثاني*
https://i.servimg.com/u/f43/13/93/90/70/eshary13.png
الأن نأتي للشرح:-
خاص فقط بالكود الأول*
https://i.servimg.com/u/f43/13/93/90/70/eshary12.png
لوحة الاداره >> مظهر المنتدى >> التومبلايت >> إدارة عامة
index_body
وأبحث عن:
الرمز:
<!-- BEGIN disable_viewonline -->
الى غاية:
الرمز:
<!-- END disable_viewonline -->
وأحذفة كله وضع هذا الكود بدالة:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, حمل الكود:
رابط التحميل
http://www.mediafire.com/download.php?qysydr8rir2wq6b
ثم سجل
ثم ندخل
لوحة الاداره >> مظهر المنتدى >> ألوان >> ورقة تصميم css
ونضع هذا الكود:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, تفضل الكود:
/*----- الأحصائيات -----*/
.tout_qeel{
padding: 5px;
}
.group{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
font-size : 12px;
display: inline;
/position: relative;
padding: 3px;
margin-right: 50px;
-moz-border-radius: 7px 7px 0px 0px ;
-webkit-border-radius: 7px 7px 0px 0px ;
border-radius:7px 7px 0px 0px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
.group:hover, .group2:hover {
font-size: 12px;
border-left : medium solid #3896B5;
border-right : medium solid #3896B5;
}
a.infobulle_rang, a.infobulle_range{
position: relative;
}
a.infobulle_rang em, a.infobulle_range em {
display:none;
}
a.infobulle_rang:hover, a.infobulle_range:hover{
border: 0;
z-index: 999;
}
a.infobulle_rang:hover em {
font-style: normal;
display: inline;
position: absolute;
top: 20px;
right:-50px;
padding: 2px;
-moz-border-radius: 3px 7px 3px 7px ;
-webkit-border-radius: 3px 7px 3px 7px ;
border-radius:3px 7px 3px 7px ;
border:1px solid #c8c092;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background:rgba(247,239,196,0.9);
width:200px;
}
a.infobulle_range:hover em {
font-style: normal;
display: inline;
position: absolute;
bottom: 20px;
right:-70px;
padding: 2px;
-moz-border-radius: 3px 7px 3px 7px ;
-webkit-border-radius: 3px 7px 3px 7px ;
border-radius:3px 7px 3px 7px ;
border:1px solid #c8c092;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background:rgba(247,239,196,0.9);
width:200px;
}
.rotation:hover{
-moz-transform: rotate(-15deg);
-webkit-transform: rotate(-15deg);
}
.gauche{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
vertical-alignement: middle;
margin:0px;
padding: 6px;
-moz-border-radius:50px 0px 50px 0px;
-webkit-border-radius:50px 0px 50px 0px;
border-radius:50px 0px 50px 0px;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
div.info_gauche em {
display:none;
}
div.info_gauche:hover {
z-index: 999;
cursor: hand;
position: relative;
border: 0;
}
div.info_gauche:hover em {
font-style: normal;
font-size: 13px;
color:#000;
padding: 3px;
display: inline;
position: absolute;
top: 12px;
left: 7px;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background: transparent url(https://i.servimg.com/u/f65/11/95/30/70/231.png) repeat 0 0;
background:rgba(247,239,196,0.9);
width:90%;
}
.rotation-d:hover{
-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg);
}
.droite{
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
vertical-alignement: middle;
margin:0px;
padding: 6px;
-moz-border-radius:0px 50px 0px 50px;
-webkit-border-radius:0px 50px 0px 50px;
border-radius:0px 50px 0px 50px;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
div.info_droite em {
display:none;
}
div.info_droite:hover {
z-index: 999;
cursor: hand;
position: relative;
border: 0;
}
div.info_droite:hover em {
font-style: normal;
font-size: 13px;
color:#000;
padding: 3px;
display: inline;
position: absolute;
top: 10px;
right:7px;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
background: transparent url(https://i.servimg.com/u/f65/11/95/30/70/231.png) repeat 0 0;
background:rgba(247,239,196,0.9);
width:90%;
}
.texte_rotation{
float: left;
margin-top: -140px;
margin-left: 270px;
padding: 3px;
color: #000;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 7px 0px ;
-webkit-border-radius: 7px 7px 7px 0px ;
border-radius:7px 7px 7px 0px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#FFFFFF', Direction=140, Strength=2);
zoom: 1;
-moz-transform: rotate(40deg);
-webkit-transform: rotate(40deg);
background:rgba(247,239,196,0.9);
}
.texte_rotation_2{
float: right;
margin-top: -135px;
margin-right: 280px;
padding: 3px;
color: #000;
border:1px solid #c8c092;
-moz-border-radius: 7px 7px 0px 7px ;
-webkit-border-radius: 7px 7px 0px 7px ;
border-radius:7px 7px 0px 7px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color='#FFFFFF', Direction=140, Strength=2);
zoom: 1;
-moz-transform: rotate(-40deg);
-webkit-transform: rotate(-40deg);
background:rgba(247,239,196,0.9);
}
.texte_rotation_2:hover, .texte_rotation:hover{
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-moz- text-shadow:0px 1px 0px #FFFFFF;
-webkit- text-shadow:0px 1px 0px #FFFFFF;
text-shadow:0px 1px 0px #FFFFFF;
filter:progid:DXImageTransform.Microsoft.Shadow(color=' #FFFFFF', Direction=140, Strength=2);
zoom: 1;
}
.group2 {
background-image: url("https://i.servimg.com/u/f43/13/93/90/70/altbg10.gif");
font-size : 12px;
display: inline;
/position: relative;
float: left;
padding: 3px;
margin-left:50px;
margin-top:-2px;
-moz-border-radius: 0px 0px 7px 7px ;
-webkit-border-radius: 0px 0px 7px 7px ;
border-radius:0px 0px 7px 7px ;
border-left : medium solid #3864B5;
border-right : medium solid #3864B5;
-moz-box-shadow: 0px 0px 1px #000;
-webkit-box-shadow: 0px 0px 1px #000;
box-shadow: 0px 0px 1px #000;
}
ثم سجل
خاص فقط بالكود الثاني*
اقتباس :https://i.servimg.com/u/f43/13/93/90/70/eshary13.png
لوحة الاداره >> مظهر المنتدى >> التومبلايت >> إدارة عامة
index_body
وأبحث عن:
الرمز:
<!-- BEGIN disable_viewonline -->
الى غاية:
الرمز:
<!-- END disable_viewonline -->
وأحذفة كله وضع هذا الكود بدالة:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
شكرآ لردك, حمل الكود:
رابط التحميل
http://www.mediafire.com/download.php?4dyv9kfpl553gh8
ثم سجل
ثم ندخل
لوحة الاداره >> مظهر المنتدى >> ألوان >> ورقة تصميم css
ونضع هذا الكود:
تنوية:- تفضل مشكورآ بوضع ردآ ليظهر لك بقية الموضوع والشرح
ثم سجل
أنتهى شرحنا لكيفيةوضع كود الأحصائيات