Christian Science Responsive Widgets
Bible Quotes Widget
Other examples
Display parameters
Parameters copied to the clipboard
Param Default Options Description SP ● bq css Style Prefix DC Y Y or N Daily Cycle through Bible quotes IW 90 (max 200) Set pixel width of Bible image IM B B,L or N Image: Background, Left (Bible) or None IA Y Y or N Include Attribution for quotation ● Allows you to have multiple versions of this widget, each with their own associated CSS, on a single web page
Javascript for extracting widget content
Javascript code copied to the clipboard
<head> ... <script type='text/javascript' src='https://christianscience.org.uk/rwidgets/js/tmwidgets.js'></script> <script type='text/javascript'> getWidgetData('biblequotes','','BQwidget'); </script> ... </head> <body> ... <div id='BQwidget'></div> ... </body>
Notes ● The getWidgetData (javascript function) has three elements 1=Widget reference, 2=parameters and 3=div id where widget content is to be displayed ● Put javascript references in page head section ● Put referenced widget div in page body section for content display ● There is no javascript dependency on jQuery
Styling illustration
Styling example copied to the clipboard
<style type='text/css'> .bqGroup{font-family:Arial;width:'100%';font-size:12px;background-image:url(https://www.christianscience.org.uk/rwidgets/img/Bbg.png);background-size:cover;} .bqText{padding:10px;font-size:18px;text-shadow:1px 0px 0 #fff;} .bqSource{padding:10px;25px;text-align:right;text-shadow:1px 0px 0 #fff;} .bqImage{float:left;padding-right:10px;width:120px;} .bqQT{font-size:20px;font-weight:bold;} a.bqRefLink{text-decoration:none;color:#000099;} a.bqRefLink:hover,a.bqRefLink:active{text-decoration:none;color:#000;} </style>
 

© 2026  T Marr IT Services     •     Email: itservices@trevormarr.com    •     Privacy    •     Cookies    •     Site Map