De hoogte en breedte van een widget wijzigen
Om de afmetingen van een widget te wijzigen hebt u enige kennis van HTML nodig, maar het proces is eenvoudig. Aan de hand van dit proces kunt u bepalen hoe de widget op uw website wordt weergegeven.
N.B. Dit proces is alleen van toepassing op de JavaScript-code van een widget. Momenteel kunt u de grootte van URL-widgets niet wijzigen.
De hoogte en breedte van een widget stemmen standaard overeen met de grootte van de browser. Deze dynamische eigenschap zorgt ervoor dat de widget zichtbaar is bij de meeste schermresoluties.
Voeg de tag <div style> toe aan de code rond uw widget om de afmetingen van de widget aan te passen. Hiervoor hebt u HTML nodig. Met deze stap maakt u de frameweergave van de widget volledig aanpasbaar.
De code van de widget wordt hieronder weergegeven. U kunt de code ophalen door op de bijbehorende koppeling code ophalen te klikken op de pagina Beheren:
<script type='text/javascript' language='JavaScript' src='https://secure.echosign.com/public/embeddedWidget?wid=2AAABLblqZhCb3ZNyEbi1ywHYaBw893IPRafJOjVvgE44n4Kb36XRArp5QgTpBhUWhLa7x81ek18*'></script>
Voeg de volgende code toe aan het begin van de widgetcode om de grootte aan te passen. Met deze code stelt u de breedte in op 500 pixels en de hoogte op 600 pixels. De rand van de widget kan ook worden aangepast door de randeigenschappen te wijzigen.
<div style="height:500px; width:600px; border:1px solid black;">
Voeg de volgende code toe aan de website die de widget host:
<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>
Zoals u ziet, wordt de uiteindelijke widget weergegeven met de eerder vermelde afmetingen. Natuurlijk zijn deze afmetingen niet ideaal, maar het toont wel aan dat het instellen van de hoogte en breedte invloed heeft op de weergegeven widget.
Meer voorbeelden
Volledig scherm 1
<body style="margin: 0; padding: 0;">
<script type='text/javascript' language='JavaScript' src='https://secure.echosign.com/public/embeddedWidget?wid=[voeg hier uw widget-id in]'>
</script>
</body>
Volledig scherm 2
<div style="height:100%; width:100%; border:0px solid black;">
<script> </script>
</div>