CINXE.COM
Unreached of Day Widget | Joshua Project
<!DOCTYPE html> <html lang="en"> <head> <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-NLCFMPJ');</script> <!-- End Google Tag Manager --> <meta charset="utf-8" /> <title> Unreached of Day Widget | Joshua Project</title> <meta name="description" content="" /> <meta name="keywords" content="" /> <meta name="author" content="Joshua Project" /> <meta name="csrf-token" content="n0LbVQuHaDkj1rvPhafxDmrHAGzDz7K3kmlFHvKM"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5"> <link rel="stylesheet" href="/assets/cache/css/frontend.min.css?id=6393abc38f130977f145b50dab1bd45c" /> <!-- Favicons ================================================== --> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://joshuaproject.net/assets/ico/apple-touch-icon-144-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://joshuaproject.net/assets/ico/apple-touch-icon-114-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="https://joshuaproject.net/assets/ico/apple-touch-icon-72-precomposed.png"> <link rel="apple-touch-icon-precomposed" href="https://joshuaproject.net/assets/ico/apple-touch-icon-57-precomposed.png"> <link rel="shortcut icon" href="https://joshuaproject.net/assets/ico/favicon.png"> </head> <body class=" resources upgotd_page "> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NLCFMPJ" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <nav class="navbar-default yamm navbar bg-primary navbar-fixed-top hidden-print"> <div id="main-nav-wrapper"> <div class="navbar-header"> <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#jsp-main-nav" aria-expanded="false" type="button"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="/"> <img width="30" height="30" class="jp-logo align-top" src="/assets/img/logos/jp_logo_light_white.png" alt="Joshua Project"> Joshua Project </a> </div> <div class="collapse navbar-collapse" id="jsp-main-nav"> <ul class="nav navbar-nav navbar-right"> <li class="search-first "> <a href="/search"><span class="icon-icon_search"></span> Search</a> </li> <li class="people-groups-dropdown yamm-fw dropdown mega-menu"> <a href="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> People Groups <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content container"> <!-- <div class="row"> --> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/people_groups">People Groups</a></p> <ul> <li> <a href="/search" class="">Search</a> </li> <li> <a href="/people_groups/dashboard" class="">Global Dashboard</a> </li> <li> <a href="/people_groups/interactive" class="">Global Interactive</a> </li> <li> <a href="/lists" class="">All Lists</a> </li> <li> <a href="/filter" class="">Create a List</a> </li> <li> <a href="/people_groups/counts" class="">Ways of Counting</a> </li> <li> <a href="/people_groups/facts" class="">Interesting Facts</a> </li> </ul> </div> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/lists">By Geography</a></p> <ul> <li> <a href="/countries/AF" class="">Countries</a> </li> <li> <a href="/regions/2" class="">Regions</a> </li> <li> <a href="/continents/AFR" class="">Continents</a> </li> </ul> </div> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/lists">By Ethnicity</a></p> <ul> <li> <a href="/affinity_blocs/11" class="">Affinity Blocs</a> </li> <li> <a href="/clusters/102" class="">People Clusters</a> </li> </ul> </div> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/lists">By Progress</a></p> <ul> <li> <a href="/progress/1" class="">Progress Levels</a> </li> <li> <a href="/unreached/1" class="">Unreached Peoples</a> </li> <li> <a href="/frontier" class="">Frontier Peoples</a> </li> </ul> </div> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/lists">By Other</a></p> <ul> <li> <a href="/languages/hau" class="">Languages</a> </li> <li> <a href="/religions/2" class="">Religions</a> </li> </ul> </div> <div class="col-xs-12 col-sm-4 col-md-2"> <p class="section-header"><a href="/global">Global</a></p> <ul> <li> <a href="/global/countries" class="">Countries</a> </li> <li> <a href="/global/regions" class="">Regions</a> </li> <li> <a href="/global/continents" class="">Continents</a> </li> <li> <a href="/global/clusters" class="">People Clusters</a> </li> <li> <a href="/global/affblocs" class="">Affinity Blocs</a> </li> <li> <a href="/global/religions" class="">Religions</a> </li> <li> <a href="/global/progress" class="">Progress Levels</a> </li> </ul> </div> <!-- </div> --> </div> </li> </ul> </li> <li class="resources-dropdown dropdown yamm-fw mega-menu"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Resources <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content container"> <div class="row"> <div class="col-xs-12 col-sm-2"> <p class="section-header"><a href="/resources/maps">Maps</a></p> <!-- <p class="section-header">Maps</p> --> <ul> <li> <a href="/resources/maps" class="">People Group Maps</a> </li> <li> <a href="/maps/world" class="">World Map</a> </li> <li> <a href="/maps/google" class="">Google Maps</a> </li> <li> <a href="/maps/india" class="">India Peoples Map</a> </li> <li> <a href="/maps/cartograms" class="">Cartograms</a> </li> </ul> </div> <div class="col-xs-12 col-sm-2"> <p class="section-header"><a href="/resources/media">Media</a></p> <!-- <p class="section-header">Media</p> --> <ul> <li> <a href="/resources/infographics" class="">Infographics</a> </li> <li> <a href="/resources/presentations" class="">Presentations</a> </li> <li> <a href="/resources/videos" class="">Videos</a> </li> <li> <a href="/resources/photos" class="">Photos</a> </li> </ul> </div> <div class="col-xs-12 col-sm-2"> <p class="section-header"><a href="/resources/apps">Apps</a></p> <!-- <p class="section-header">Apps</p> --> <ul> <li> <a href="/pray/unreachedoftheday/app" class="">Unreached of Day</a> </li> <li> <a href="/resources/apps" class="">31 Frontier Peoples</a> </li> <li> <a href="/resources/apps" class="">300 Frontier Peoples</a> </li> </ul> </div> <div class="col-xs-12 col-sm-2"> <!-- <p class="section-header"><a href="/resources/datasets">Data</a></p> --> <p class="section-header">Data</p> <ul> <li> <a href="/resources/datasets" class="">Datasets</a> </li> <li> <a href="/resources/datasets" class="">Usage Examples</a> </li> <li> <a href="/resources/datasets" class="">API</a> </li> <li> <a href="https://api.joshuaproject.net" class="">API Documentation</a> </li> </ul> </div> <div class="col-xs-12 col-sm-2"> <p class="section-header"><a href="/resources/materials">Materials</a></p> <!-- <p class="section-header">Materials</p> --> <ul> <li> <a href="/resources/articles" class="">Articles</a> </li> <li> <a href="/resources/books" class="">Books</a> </li> <li> <a href="/resources/bulletins" class="">Bulletin Inserts</a> </li> <li> <a href="/resources/booklets" class="">Regional Booklets</a> </li> </ul> </div> <div class="col-xs-12 col-sm-2"> <!-- <p class="section-header"><a href="/resources/other">Other</a></p> --> <p class="section-header">Other</p> <ul> <li> <a href="/resources/prayer" class="">Prayer Resources</a> </li> <li> <a href="/resources/children" class="">Children's Resources</a> </li> <li> <a href="/resources/church" class="">Church Resources</a> </li> <li> <a href="/resources/multilingual" class="">Multilingual Resources</a> </li> <!-- Removed 06/22/23 <li> <a href="/resources/new" class="">New Resources</a> </li> --> </ul> </div> </div> </div> </li> </ul> </li> <li class="pray-dropdown dropdown mega-menu active"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Pray <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content"> <div class="pray-two-col"> <p class="section-header"><a href="/pray/unreachedoftheday">Unreached of Day</a> </p> <ul> <li><a href="/pray/unreachedoftheday/today" class="">Today</a></li> <li><a href="/pray/unreachedoftheday/app" class="">Mobile App</a></li> <li><a href="/pray/unreachedoftheday/email" class="">Email</a></li> <li><a href="/pray/unreachedoftheday/podcast" class="">Podcast</a></li> <!-- <li><a href="/pray/unreachedoftheday/widget" class="active">Web Widget</a></li> --> <li><a href="/pray/unreachedoftheday/calendar" class="">Calendar</a></li> <li><a href="/pray/unreachedoftheday/print" class="">Print/Download</a></li> <li><a href="/pray/unreachedoftheday/cards" class="">Prayer Cards</a></li> </ul> <span class="hidden-lg"><br /></span> </div> <div class="pray-two-col"> <p class="section-header"> <a href="/resources/prayer" class="">Prayer Resources</a> </p> <ul> <li><a href="/pray/cards" class="">Prayer Cards</a></li> <li><a href="/pray/guides" class="">Prayer Guides</a></li> <li><a href="/pray/videos" class="">Prayer Videos</a></li> <li><a href="/pray/ideas" class="">Prayer Ideas</a></li> </ul> </div> </div> </li> </ul> </li> <li class="involved-dropdown dropdown mega-menu"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Get Involved <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content"> <div class="pray-two-col"> <p class="section-header"> <a href="/get_involved/serve" class="">Serve with Joshua Project</a> </p> <ul> <li><a href="/get_involved/staff" class="">As a Staff Member</a></li> <li><a href="/get_involved/volunteer" class="">As a Volunteer</a></li> </ul> <span class="hidden-lg"><br /></span> </div> <div class="pray-two-col"> <p class="section-header"> <a href="/get_involved/steps" class="">Mission Next Steps</a> </p> <ul> <li><a href="/get_involved/steps/learn" class="">Learn About Missions</a></li> <li><a href="/get_involved/steps/local" class="">Get Involved Where I Live</a></li> <li><a href="/get_involved/steps/go" class="">Get Involved By Going</a></li> <li><a href="/get_involved/steps/data" class="">Use People Group Data</a></li> </ul> </div> </div> </li> </ul> </li> <li class="about-dropdown yamm-fw dropdown mega-menu"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> About <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content container"> <div class="row"> <div class="col-xs-12 col-sm-offset-2 col-sm-2"> <!-- <p class="section-header"><a href="/about">About</a></p> --> <p class="section-header">About</p> <ul> <li><a href="/about/details" class="">Joshua Project</a></li> <li><a href="/about/survey" class="">Survey Results</a></li> <li><a href="/about/sources" class="">Data Sources</a></li> <li><a href="/about/connections" class="">Connections</a></li> </ul> </div> <div class="col-xs-12 col-sm-3"> <!-- <p class="section-header"><a href="/about/policy">Data Policies</a></p> --> <p class="section-header">Data Policies</p> <ul> <li><a href="/resources/articles/making_a_people_group_list" class="">Making a Peoples List</a></li> <li><a href="/about/policy/small" class="">Small People Policy</a></li> <li><a href="/about/policy/southasia" class="">South Asia Policy</a></li> <li><a href="/about/policy/addremove" class="">Add and Remove Policy</a></li> </ul> </div> <div class="col-xs-12 col-sm-2"> <!-- <p class="section-header"><a href="/donate">Financial</a></p> --> <p class="section-header">Financial</p> <ul> <li> <a href="/donate" class="">Donate Online</a> </li> <li> <a href="/donate#postal" class="">Donate by Mail</a> </li> <li> <a href="/donate/other" class="">Other Ways to Donate</a> </li> </ul> </div> <div class="col-xs-12 col-sm-3"> <!-- <p class="section-header"><a href="/contact">Submit</a></p> --> <p class="section-header">Submit Updates</p> <ul> <li> <a href="/contact/general_submit?type=data">Statistical Update</a> </li> <li> <a href="/contact/general_submit?type=photo">People Group Photo</a> </li> <li> <a href="/contact/general_submit?type=map">People Group Map</a> </li> <li> <a href="/contact/profile_submit" class="">Profile or Correction</a> </li> <li> <a href="/contact" class="">Contact Us</a> </li> </ul> </div> </div> </div> </li> </ul> </li> <li class="help-dropdown dropdown mega-menu"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Help <span class="caret"></span> <span class="glyphicon glyphicon-plus pull-right" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove pull-right" aria-hidden="true"></span> </a> <ul class="dropdown-menu"> <li> <div class="yamm-content"> <!-- <p class="section-header"><a href="/help">Help</a></p> --> <p class="section-header">Help</p> <ul> <li> <a href="/search" class="">Search</a> </li> <li> <a href="/help/definitions" class="">Definitions</a> </li> <li> <a href="/help/faqs" class="">FAQs</a> </li> <li> <a href="/help/terms" class="">Terms of Use</a> </li> <li> <a href="/help/privacy" class="">Privacy Policy</a> </li> <li> <a href="/help/sitemap" class="">Sitemap</a> </li> </ul> </div> </li> </ul> </li> <li class="about-dropdown yamm-fw dropdown mega-menu"> <a href="/donate">Donate</a> </li> <li class="search-last " data-toggle="tooltip" data-placement="bottom" title="Find a People Group, People Cluster, Affinity Bloc, Country, Region, Continent, Language, Dialect."> <a href="/search"><span class="icon-icon_search"></span></a> </li> </ul> </div> </div> </nav> <div class="breadcrumbs"> <div class="container"> <div class="br_links"> <a class="crumb" href="https://joshuaproject.net" rel="index up" itemprop="url"><span itemprop="title">Home</span></a> <a class="crumb" itemprop="title" href="/pray">Pray</a> <a class="crumb" itemprop="title" href="/pray/unreachedoftheday">Unreached of Day</a> <a class="crumb" itemprop="title">Widget</a> </div> </div> </div> <div class="container"> <div class="upgotd_title"> <header> <h2><i class="glyphicon glyphicon-user"></i><a href="/pray/unreachedoftheday">Unreached of Day</a>: Widget</h2> <div class="upgotd_menu"> <ul id="myTab"> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-home"></i><a href="/pray/unreachedoftheday/today">Today</a></li> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-phone"></i><a href="/pray/unreachedoftheday/app">App</a></li> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-envelope"></i><a href="/pray/unreachedoftheday/email">Email</a></li> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-headphones"></i><a href="/pray/unreachedoftheday/podcast">Podcast</a></li> <!-- <li class="upgotd_tab_title"><i class="glyphicon glyphicon-cog"></i><a href="/pray/unreachedoftheday/widget">Widget</a></li> --> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-calendar"></i><a href="/pray/unreachedoftheday/calendar">Calendar</a></li> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-print"></i><a href="/pray/unreachedoftheday/print">Print / Download</a></li> <li class="upgotd_tab_title"><i class="glyphicon glyphicon-plus"></i><a href="/pray/unreachedoftheday/cards">Prayer Cards</a></li> </ul> </div> </header> </div> <div class="unreached-widget"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div class="widget_type center"> <div class="red">Javascript version</div> <!-- (highly customizable) --> </div> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"> <div class="widget_steps"> <div class="widget_steps_number">1.</div> <div class="widget_steps_text">Customize the widget by selecting the language, size, colors, fonts, borders and content below that match your website.</div> </div> <div class="options_container"> <div class="accordion"> <h3>Samples</h3> <div class="center"> <div class="radioset" id="samples"> <form> <input type="radio" id="temp0" class="color_temp_radio" name="radio" value="0"><label for="temp0">Green</label> <input type="radio" id="temp1" class="color_temp_radio" name="radio" value="1"><label for="temp1">Blue</label> <input type="radio" id="temp2" class="color_temp_radio" name="radio" value="2"><label for="temp2">Grey</label> <input type="radio" id="temp3" class="color_temp_radio" name="radio" value="3"><label for="temp3">B&W</label> <input type="radio" id="temp4" class="color_temp_radio" name="radio" value="4"><label for="temp4">Plain</label> </form> </div> </div> <h3>Language</h3> <div class="center"> <p class="widget-note">Browser attempts to detect the user's language. If that fails, this is the language the widget will display in.</p> <form> <table> <tr> <td>Default<br/>Language:</td> <td> <select id="display_language"> <option value="deu">Deutsche</option> <option value="eng" selected="true">English</option> <option value="spa">Español</option> <option value="fra">Français</option> <option value="ita">Italiano</option> <option value="kor">한국어</option> <option value="por">Português</option> <option value="vie">Tiếng Việt</option> <option value="cmn">今日未得之民</option> </select> </td> </tr> </table> </form> </div> <h3>Size and Shape</h3> <div> <div id="width_slider" class="slider"></div> <div id="width_spinner"> Width: <input type="text" id="wpw" class="spinner" value="230"/> </div> <div class="radioset" id="orientation"> <center> <form> <input type="radio" id="radio_portrait" name="radio" value="vert" checked="checked"><label for="radio_portrait">Portrait</label> <input type="radio" id="radio_horizontal" name="radio" value="horz"><label for="radio_horizontal">Landscape</label> </form> </center> </div> <br/> </div> <h3>Colors</h3> <div> <table id="colorSelectors" class="left"> <tr> <td>Background: </td> <td><input type="text" id="cbg" class="colorpicker"/></td> </tr> <tr> <td>Header: </td> <td><input type="text" id="bbg" class="colorpicker"/></td> </tr> <tr> <td>Header Font: </td> <td><input type="text" id="blc" class="colorpicker"/></td> </tr> <tr> <td>Header Font Hover: </td> <td><input type="text" id="bhc" class="colorpicker"/></td> </tr> <tr> <td>Center Font: </td> <td><input type="text" id="cfc" class="colorpicker"/></td> </tr> <tr> <td>Center Font Link: </td> <td><input type="text" id="clc" class="colorpicker"/></td> </tr> <tr> <td>Center Font Link Hover:</td> <td><input type="text" id="chc" class="colorpicker"/></td> </tr> <tr> <td>Footer Background: </td> <td><input type="text" id="fbg" class="colorpicker"/></td> </tr> <tr> <td>Footer Font: </td> <td><input type="text" id="ffc" class="colorpicker"/></td> </tr> <tr> <td>Footer Links: </td> <td><input type="text" id="flc" class="colorpicker"/></td> </tr> <tr> <td>Footer Link Hover: </td> <td><input type="text" id="fhc" class="colorpicker"/></td> </tr> </table> </div> <h3>Fonts</h3> <div> <table> <tr> <td>Font type:</td> <td><select id="oft" class="fontpicker"> <option value="">Select Font Style</option> <option class="font" value="Andale Mono">Andale Mono</option> <option class="font" value="Arial">Arial</option> <option class="font" value="Arial Black">Arial Black</option> <option class="font" value="Arial Narrow">Arial Narrow</option> <option class="font" value="Baskerville">Baskerville</option> <option class="font" value="Book Antiqua">Book Antiqua</option> <option class="font" value="Calibri">Calibri</option> <option class="font" value="Cambria">Cambria</option> <option class="font" value="Century Gothic">Century Gothic</option> <option class="font" value="Comic Sans MS">Comic Sans</option> <option class="font" value="Copperplate">Copperplate</option> <option class="font" value="Courier New">Courier New</option> <option class="font" value="Futura">Futura</option> <option class="font" value="Garamond">Garamond</option> <option class="font" value="Geneva">Geneva</option> <option class="font" value="Georgia">Georgia</option> <option class="font" value="Gill Sans">Gill Sans</option> <option class="font" value="Helvetica">Helvetica</option> <option class="font" value="Impact">Impact</option> <option class="font" value="Lucida Bright">Lucida Bright</option> <option class="font" value="Lucida Console">Lucida Console</option> <option class="font" value="Lucida Sans Typewriter">Lucida Sans Typewriter</option> <option class="font" value="Lucida Grande">Lucida Grande</option> <option class="font" value="Monaco">Monaco</option> <option class="font" value="Open Sans">Open Sans</option> <option class="font" value="Palatino">Palatino</option> <option class="font" value="Papyrus">Papyrus</option> <option class="font" value="Tahoma">Tahoma</option> <option class="font" value="Times New Roman">Times New Roman</option> <option class="font" value="Trebuchet MS">Trebuchet MS</option> <option class="font" value="Verdana">Verdana</option> </select> </td> </tr> <tr> <td>Title size:</td> <td><select id="tfsz" class="fontpicker"> <option value="">Select Font Size</option> <option value="8">8px</option> <option value="9">9px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="14">14px</option> <option value="16">16px</option> <option value="18">18px</option> <option value="20">20px</option> <option value="24">24px</option> <option value="28">28px</option> </select> </td> </tr> <tr> <td>People size:</td> <td><select id="pfsz" class="fontpicker"> <option value="">Select Font Size</option> <option value="8">8px</option> <option value="9">9px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="14">14px</option> <option value="16">16px</option> <option value="18">18px</option> <option value="20">20px</option> <option value="24">24px</option> </select> </td> </tr> <tr> <td>Info size:</td> <td><select id="ifsz" class="fontpicker"> <option value="">Select Font Size</option> <option value="8">8px</option> <option value="9">9px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="14">14px</option> <option value="16">16px</option> <option value="18">18px</option> <option value="20">20px</option> </select> </td> </tr> <tr> <td>Footer size:</td> <td><select id="ffsz" class="fontpicker"> <option value="">Select Font Size</option> <option value="8">8px</option> <option value="9">9px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="14">14px</option> <option value="16">16px</option> <option value="18">18px</option> <option value="20">20px</option> <option value="24">24px</option> </select> </td> </tr> </table> </div> <h3>Border</h3> <div> <div id="border_options"> <table> <tr> <td>Border Width:</td> <td> <select id="border_width"> <option>0px</option> <option>1px</option> <option>2px</option> <option>3px</option> <option>4px</option> <option>5px</option> <option>6px</option> </select> </td> </tr> <tr> <td>Border Color:</td> <td><input type="text" id="bdc" class="colorpicker"/></td> </tr> <tr> <td>Border Curved:</td> <td> <input type="checkbox" class="button br_check" id="top" name="field" value="Top"><label class="br_check_label" for="top">Top</label> <input type="checkbox" class="button br_check" id="bottom" name="field" value="Bottom"><label class="br_check_label" for="bottom">Bottom</label> </td> </tr> <tr> <td>Border Radius:</td> <td><div id="bdr"></div></td> </tr> </table><br /> </div> </div> <h3>Fields to Display</h3> <div> Toggle which widget fields to display.<br/> <input type="checkbox" class="button jq_check" id="pop" name="field" value="Population" checked><label class="jq_check_label" for="pop">Population</label><br/> <input type="checkbox" class="button jq_check" id="lan" name="field" value="Language" checked><label class="jq_check_label" for="lan">Language</label><br/> <input type="checkbox" class="button jq_check" id="relg" name="field" value="Religion" checked><label class="jq_check_label" for="relg">Religion</label><br/> <input type="checkbox" class="button jq_check" id="stat" name="field" value="Status" checked><label class="jq_check_label" for="stat">Status</label><br/> </div> </div><!-- close accordion --> <center><button class="button" id="reset">Reset to Default</button></center> </div><!-- options_container --> </div> <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 results_container"><!-- result --> <div class="widget_container"> <div class="widget_steps"> <div class="widget_steps_text center"><br />PREVIEW</div> </div> <div id="widget"></div> <!-- alternative for no javascript --><noscript><a href="/upgotd/upgotd_new.php">View Unreached People of the Day</a></noscript> </div><!-- widget_container --> </div><!-- results_container --> </div><!-- row close --> <div class="row"> <div class="col-xs-12"> <div class="code_container"> <div class="widget_steps"> <div class="widget_steps_number">2.</div> <div class="widget_steps_text clipboard-wrapper"> <br /><a id="copy-to-clipboard" data-clipboard-target="#textarea"><span class="smaller-text" title="Copied!">Copy</span></a> and paste the code below into your website. <!-- <a id="copy-to-clipboard" data-clipboard-target="#textarea" class="right"><span class="smaller-text" title="Copied!">Copy</span> <i class="ico-icon-clipboard" aria-hidden="true"></i></a> --> </div> </div> <textarea id="textarea" type="textarea"> </textarea> </div><!-- code_container --> </div> </div><!-- row close --> </div> </div> </div> <div id="ft_large"> <div class="container hidden-print "> <div class="row"> <a class="ft_data col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/datasets"> <span class="glyphicon glyphicon-th"></span> <span class="title">Datasets / API</span> </a> <a class="ft_apps col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/apps"> <span class="glyphicon glyphicon-phone"></span> <span class="title">Mobile Apps</span> </a> <a class="ft_media col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/media"> <span class="glyphicon glyphicon-film"></span> <span class="title">Videos / Photos / Maps</span> </a> <a class="ft_articles_books col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/articles"> <span class="glyphicon glyphicon-folder-open"></span> <span class="title">Articles / Books</span> </a> <a class="ft_handouts_pres col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/presentations"> <span class="glyphicon glyphicon-picture"></span> <span class="title">Vision Resources</span> </a> <a class="ft_pray col-xs-4 col-sm-2 col-md-2 col-lg-2" href="/resources/prayer"> <span class="glyphicon glyphicon-plus"></span> <span class="title">Prayer Resources</span> </a> </div> </div> </div> <br/> <div id="ft_small"> <span class="social-icons"> <a href="https://www.facebook.com/jpunreached" aria-label="Facebook social media link"><img src="/assets/img/logos/facebook.svg" fill="black"></a> <a href="https://twitter.com/jpunreached" aria-label="X / Twitter social media link"><img src="/assets/img/logos/x.svg" fill="black"></a> <a href="https://instagram.com/jpunreached/" aria-label="Instagram social media link"><img src="/assets/img/logos/instagram.svg" fill="black"></a> </span> <br /> <div> <a href="\"><img src="/assets/img/logos/jp_logo.jpg" alt="Joshua Project logo"></a> <a href="/help/terms">Terms of Use</a> <a href="/help/privacy">Privacy Policy</a> <a href="\contact">Contact Us</a> <!-- <a href="/help/ethics">AI Ethics Statement</a> --><span class="hidden-lg"><br></span>Copyright © 2025 <br /><br /> </div> </div> <script src="/assets/cache/js/frontend.js?id=1a163f09713e9b87f1816d12daabca6a"></script> <!-- <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" charset="utf-8"></script> --> <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js" integrity="sha512-sIqUEnRn31BgngPmHt2JenzleDDsXwYO+iyvQ46Mw6RL+udAUZj2n/u/PGY80NxRxynO7R9xIGx5LEzw4INWJQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script type="text/javascript" src="/assets/js/widget/jquery-ui.js"></script> <script src="https://code.jquery.com/jquery-migrate-3.4.0.min.js" integrity="sha256-mBCu5+bVfYzOqpYyK4jm30ZxAZRomuErKEFJFIyrwvM=" crossorigin="anonymous"></script> <script type="text/javascript" src="/assets/js/widget/spectrum.js"></script> <script type="text/javascript" src="/assets/js/widget/application.js"></script> <!-- <script type="text/javascript"> //<![CDATA[ //I think this reloads the widget when a new option is selected. -Jake try{(function(a){var b="https://",c="joshuaproject.net",d="/cdn-cgi/cl/",e="img.gif",f=new a;f.src=[b,c,d,e].join("")})(Image)}catch(e){} //]]> </script> --> <script> // Handle copy to clipboard click $(document).ready(function() { $('#copy-to-clipboard .smaller-text').tooltip({ placement: 'left', trigger: 'manual' }); var clipboard = new ClipboardJS('#copy-to-clipboard'); clipboard.on('success', function(e) { $('#copy-to-clipboard .smaller-text').tooltip('show'); setTimeout(function() { $('#copy-to-clipboard .smaller-text').tooltip('hide'); }, 500); }); }); // var iAmPrayingURL = 'https://unreachedoftheday.org/praying-widget/?prayer-id=02-17&btnbgclr=770000&btnftclr=ffffff&btnhvbgclr=a6a6a6&btnhvftclr=ffffff&fsize=18&countftclr=770000&countbgclr=ffffff&countedbgclr=770000&countedbrdclr=770000&countedbrdclr=770000&countedftclr=ffffff'; // (function() { // // We need to use Javascript to bypass issue with FF that fails to pass GET params // widget = document.getElementById('praying-widget'); // iframe = document.createElement('iframe'); // iframe.setAttribute('id', 'i-am-praying-button'); // iframe.setAttribute('src', iAmPrayingURL); // iframe.setAttribute('width', '100%'); // iframe.setAttribute('height', '50'); // iframe.setAttribute('frameborder', '0'); // iframe.setAttribute('scrolling', 'no'); // widget.innerHTML = ''; // widget.appendChild(iframe); // }()); </script> </body> </html>