Personnaliser l’affichage de votre like box
La personnalisation des plugins fournis par Facebook n’est pas une tache facile du tout grâce à la somme des détails et des informations offertes sur Facebook.C’est pour cela et grâce à l’aide de Daddydesigns pour leurs inspiration
pour rédiger ce petit guide que je l’ai créé sur deux parties :
- Créer la feuille de style de votre like box
- Créer le code de votre like box
Lets Go !! Créer un fichier avec l’extension .css nommer le par exemple « fb.css » et ecrire dedans ce code :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126
/*---------------Japprend.Com LikeBox Starts--------------*/
.fan_box a:hover{
text-decoration: none;
}
.fan_box .full_widget{
height: 200px;
border: 0 !important;
background: none !important;
position: relative;
}
.fan_box .connect_top{
background: none !important;
padding: 0 !important;
}
.fan_box .profileimage, .fan_box .name_block{
display: none;
}
.fan_box .connect_action{
padding: 0 !important;
}
.fan_box .connections{
padding: 0 !important;
border: 0 !important;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
color: #666;
}
span.total{
color: #333333;
font-weight: bold;
}
.fan_box .connections .connections_grid {
padding-top: 10px !important;
}
.fan_box .connections_grid .grid_item{
padding: 0 10px 10px 0 !important;
}
.fan_box .connections_grid .grid_item .name{
font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
font-weight: normal;
color: #333333 !important;
padding-top: 1px !important;
}
.fan_box .connect_get{
position: absolute;
bottom: 0;
left: 0px;
margin: 0 !important;
}
.fan_box .connect_widget .connect_widget_interactive_area {
margin: 0 !important;
}
.fan_box .connect_widget td.connect_widget_vertical_center {
padding: 0 !important;
}
/*---------------Japprend.Com LikeBox Ends--------------*/
Par la suite ajouter ce code à l’emplacement où vous voulez insérer votre like box :
1 2 3 4 5 6 7
<script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/fr_FR"></script>
<script type="text/javascript">// < ![CDATA[
FB.init("");
// ]]></script>
Sachant que :
- ID_De_Votre_PageFan : identifiant de votre page fan sur facebook, vous pouvez l’obtenir soit à partir du lien de votre page :
https://www.facebook.com/pages/Ma-Page-Fan/147104632016744
Ou bien du lien du modification de votre page fan :
https://www.facebook.com/pages/edit/?id=1667520065682&sk=basic
- Lien_Vers_Votre_Feuille_De_Style.css : après que vous uploader le fichier .css de votre feuille de style le lien vers ce fichier sera :
http://votresiteweb.com/fb.css
c’est ce lien là que vous devez mettre dans cett valeur.








0 Commentaire