Changer la hauteur et la largeur d'un widget

Définir les dimensions d'un widget exige quelques connaissances dans le langage HTML, mais le processus est simple. Ce processus vous permet de personnaliser la façon dont le widget s'adapte sur votre page Web.

Remarque :

Cette procédure s'applique uniquement au code JavaScript d'un widget. Les widgets d'URL ne peuvent actuellement pas être redimensionnés.

Par défaut, la hauteur et la largeur d'un widget sont mis à l'échelle en fonction de la taille de la fenêtre du navigateur. Cette propriété dynamique opère de sorte que le widget puisse être affiché dans la plupart des résolutions d'écran.

Pour ajuster les dimensions du widget, ajoutez une balise div de style au code situé autour du widget. Cette étape s'effectue avec HTML, ce qui permet de personnaliser entièrement l'image du widget.

Le code du widget apparaît ci-dessous, tel qu'obtenu en cliquant sur le lien get code correspondant de la page Gérer :

<script type='text/javascript' language='JavaScript' src='https://secure.echosign.com/public/embeddedWidget?wid=2AAABLblqZhCb3ZNyEbi1ywHYaBw893IPRafJOjVvgE44n4Kb36XRArp5QgTpBhUWhLa7x81ek18*'></script> 

Pour ajuster la taille, ajoutez le code suivant avant le code du widget. Ce code définit la largeur sur 500 pixels et la hauteur sur 600 pixels. La bordure de l'image de widget peut également être ajustée en modifiant les propriétés bordure.

<div style="height:500px; width:600px; border:1px solid black;">

Le code à placer sur le site Web hébergeant le widget est le suivant :

<html>

<div style="height:500px; widget:600px; border: 1px solid black;">

<script type='text/javascript' language='JavaScript' src='https://secure.echosign.com/public/embeddedWidget?wid=2AAABLblqZhCb3ZNyEbi1ywHYaBw893IPRafJOjVvgE44n4Kb36XRArp5QgTpBhUWhLa7x81ek18*'>

</script>

</div>

</html>

Comme vous pouvez le voir, le widget résultant s'affiche avec les dimensions spécifiées. À l'évidence, ces dimensions ne sont pas idéales, mais elles montrent comment le fait de définir les valeurs de hauteur et de largeur affecte le widget publié.

Plus d'exemples

Plein écran 1

<body style="margin: 0; padding: 0;">
<script type='text/javascript' language='JavaScript' src='https://secure.echosign.com/public/embeddedWidget?wid=[yourwidgteId goes here]'>

</script>
</body>

Plein écran 2

<div style="height:100%; width:100%; border:0px solid black;">

<script> </script>

</div>

 

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne