Birthday

July 14, 2012 is TipRicks's Birthday, Please Prepare and Send Good Wishes to its team!

UnderStood
TipRicks is under maintenance! If you found any error please let us know. Contact Us ×

Hello!

Click one of our representatives below to chat on WhatsApp

Support Customer Service Center
+923084774257
You can also send us an email to support@tipricks.com
Hello! What can I do for you?
×
How can I help you?

How to Install Fasting Congratulations Pop Up Greetings Widget

SHARE:

Not feel the month of Ramadan in 2019 has arrived, we will enter the holy month of blessing soon. Never mind that the month of Ramadan in ...

Not feel the month of Ramadan in 2019 has arrived, we will enter the holy month of blessing soon. Never mind that the month of Ramadan in 2019 has arrived, a blessed holy month will soon be upon us. Ramadan is one of the most awaited moments by Muslims throughout the world. The month of Ramadan is one of the most anticipated moments of Muslims around the world. Because at this time many benefits and special things that are always felt by Muslims. Because this is where many benefits and special things are always experienced by Muslims. So when Ramadan arrives, that special month will always be welcomed with joy. So when Ramadan arrives, the special month is always celebrated with joy.

To welcome this blessed holy month TipRicks will provide tips on how to install a Fasting Congratulations Pop Up. To celebrate this blessed holy month, TipRicks will provide tips on How to Install Pop Up Fasting Safe Speech. The way it works is quite simple, a pop-up message will appear when we open a page in the blog that is equipped with a close button to close the message. The way it works is simple, a message appears when we open a page in a blog with a close button to close it. For those who are curious, let's follow the way below! For those of you who are curious, follow the procedure below!

How To Install Fasting Pop Up Greetings How To Install A Fast Greeting Pop Up


     1. First, go to Blogger
     2. Then go to the Themes menu and click the Edit HTML button
     3. Add code below before </head>
[<b:if cond='data:view.isHomepage'>
<style type='text/css'>
/* Pop Up Ramadan*/
@keyframes slideDown{0%{opacity:0;transform:translateY(-10%)}100%{opacity:1;transform:translateY(0%)}}
#tipricks-fasting{line-height:1.55;display:block;background:#fff;position:fixed;top:25%;right:0;left:0;margin:auto;text-align:center;max-width:600px;box-shadow:0 0 2.5rem -1.5rem rgba(0,0,0,0.5);z-index:99;min-height:325px;padding:20px;border-radius:10px;animation:slideDown 2s}#tipricks-fasting .fasting19{position:absolute;color:#222;font-size:1.5rem;font-weight:400;z-index:99999;text-align:center;margin:auto;padding:10px;left:0;right:0;top:17%;border-bottom:1px solid rgba(0,0,0,0.05);border-top:1px solid rgba(0,0,0,0.05)}#tipricks-fasting .fasting19 p{margin:10px auto;font-style:italic;font-family:Georgia}#tipricks-fasting .fasting19 .ramadan2019{font-size:2.5rem;font-style:normal}#tipricks-fasting a.close-popup{background:#428bca;position:absolute;bottom:20px;right:20px;color:#fff;text-align:center;cursor:pointer;z-index:99;border-radius:3px;display:inline-block;font-size:13px;padding:4px 14px;min-width:60px;border:1px solid #3885c7;transition:all 0.3s}#tipricks-fasting a.close-popup:hover{background:#fff;color:#3885c7;border-color:#3885c7}#tipricks-fasting a.close-popup:active{opacity:.9}
.diamond{position:absolute;left:0;right:0;top:-12px;margin:auto;width:10px;height:10px;background:#B9E937;box-shadow:10px 0 0 #57D131,10px 10px 0 #B9E937,0px 10px 0 #57D131,5px 5px 0 10px #fff;display:inline-block;text-align:center;transform:rotate(45deg);z-index:2}.diamond.dua{top:initial;bottom:3px}
@media screen and (max-width:768px){#tipricks-fasting .fasting19{font-size:1rem}#tipricks-fasting .fasting19 .ramadan2019{font-size:1.5rem}#tipricks-fasting{min-height:260px;left:20px;right:20px}}
</style>
</b:if>]

     4. Then add the code below before </body>

[<b:if cond='data:view.isHomepage'>
<div id='tipricks-fasting'>
<div class='diamond'></div>
<a class='close-popup' href='#' title='Close this message'>Close</a>
<div class='fasting19'>
   <p>Congratulations on Fasting</p>
   <p><span class='ramadan2019'>Ramadan 1440 H</span></p>
   <p>Forgive my Body and Soul</p>
</div>
<div class='diamond dua'></div>
</div>
<script type='text/javascript'>
//<![CDATA[
$(window).bind("load",function(){$("#tipricks-fasting").animate({top:"25%"},1e3),$("a.close-popup").click(function(){return $(this).parent().fadeOut(1e3),!1})});
//]]>
</script>
</b:if>]

     5. If so, click the Save theme button and see the results on your blog.
  • [message]
    • ##fa-info-circle## Info
      • By default, I add a special conditional tag for the main page. So if you want this pop up to appear on all pages, please remove the conditional tag.

One Time Event by Adding Cookies

If you want to add this code and want to show this message only once in the browser, use this code:

     1. Add the code below before </head>


[<b:if cond='data:view.isHomepage'>
<style type='text/css'>
/* Pop Up ramadan */
@keyframes zoomIn{from{opacity:0}50%{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10%)}100%{opacity:1;transform:translateY(0%)}}
#myModal{display:none}#tipricks-fasting{line-height:1.55;display:block;background:#fff;position:fixed;top:25%;right:0;left:0;margin:auto;text-align:center;max-width:600px;box-shadow:0 0 2.5rem -1.5rem rgba(0,0,0,0.5);z-index:1001;min-height:325px;padding:20px;border-radius:10px;animation:slideDown 1s}#tipricks-fasting .puasa19{position:absolute;color:#222;font-size:1.5rem;font-weight:400;z-index:99999;text-align:center;margin:auto;padding:10px;left:0;right:0;top:17%;border-bottom:1px solid rgba(0,0,0,0.05);border-top:1px solid rgba(0,0,0,0.05)}#tipricks-fasting .puasa19 p{margin:10px auto;font-style:italic;font-family:Georgia}#tipricks-fasting .puasa19 .ramadan2019{font-size:2.5rem;font-style:normal}#tipricks-fasting a.close-popup{background:#428bca;position:absolute;bottom:20px;right:20px;color:#fff;text-align:center;cursor:pointer;z-index:99;border-radius:3px;display:inline-block;font-size:13px;padding:4px 14px;min-width:60px;transition:all 0.3s}#tipricks-fasting a.close-popup:hover{background:#336d9e;color:#fff}#tipricks-fasting a.close-popup:active{opacity:.9}
.diamond{position:absolute;left:0;right:0;top:-12px;margin:auto;width:10px;height:10px;background:#B9E937;box-shadow:10px 0 0 #57D131,10px 10px 0 #B9E937,0px 10px 0 #57D131,5px 5px 0 10px #fff;display:inline-block;text-align:center;transform:rotate(45deg);z-index:2}.diamond.dua{top:initial;bottom:3px}#hiding{background:#3979b0;position:absolute;bottom:20px;right:78px;color:#fff;text-align:center;cursor:pointer;z-index:99;border-radius:3px;display:inline-block;font-size:20px;padding:0 10px;line-height:28px;min-width:28px;transition:all 0.3s}#hiding:hover{background:#336d9e;color:#fff}.powerfailure{position:fixed;top:0;background:rgba(0,0,0,0.35);left:0;right:0;bottom:0;margin:0;z-index:1000;animation:zoomIn 1s}
@media screen and (max-width:768px){#tipricks-fasting .puasa19{font-size:1rem}#tipricks-fasting .puasa19 .ramadan2019{font-size:1.5rem}#tipricks-fasting{min-height:260px;left:20px;right:20px}}
</style>
</b:if>]

     2. Then add the code below before </body>

[<b:if cond='data:view.isHomepage'>
<div id='myModal'>
<div id='tipricks-fasting'>
<div class='diamond'></div>
<a class='close-popup' href='javascript:void(0);' onclick='document.getElementById(&apos;myModal&apos;).style.display=&apos;none&apos;;return false;' title='Close this message'>Close</a>
<div class='hidemodal' id='hiding'><span title='Do not show this message again'>&#215;</span></div>
<div class='puasa19'>
   <p>Congratulations on Fasting</p>
   <p><span class='ramadan2019'>Ramadan 1440 H</span></p>
   <p>Forgive my Body and Soul</p>
</div>
<div class='diamond dua'></div>
</div>
<div class='powerfailure'></div>
</div>
<script type='text/javascript'>
//<![CDATA[
function setCookie(e,i,o){var n=new Date;n.setDate(n.getDate()+o);var a=escape(i)+(null==o?"":"; expires="+n.toUTCString());document.cookie=e+"="+a}function getCookie(e){var i,o,n,a=document.cookie.split(";");for(i=0;i<a.length;i++)if(o=a[i].substr(0,a[i].indexOf("=")),n=a[i].substr(a[i].indexOf("=")+1),(o=o.replace(/^s+|s+$/g,""))==e)return unescape(n)}var TipRicks_COOKIE="cookietipricks",hideMe=document.getElementById("myModal"),cookie=getCookie(TipRicks_COOKIE),cookietipricks=cookie||hideMe.style.display,hiding=document.getElementById("hiding");hiding.onclick=function(){setCookie(TipRicks_COOKIE,cookietipricks,100),hideMe.style.display="block"===cookietipricks?"none":"block",cookietipricks=hideMe.style.display},hiding.onclick();
//]]>
</script>
</b:if>]
  • [message]
    • ##fa-info-circle## Info
      • This message will reappear if the user clears cookies in their browser
     3. Click the Save theme button and see the results on your blog.
Well, that's all from TipRicks and happy fasting. Wassalam.

This article "How to Install Fasting Congratulations Pop Up Greetings Widget" is protected by




Was this article helpful?

Thanks! Your feedback will help us to improve our Services.

COMMENTS

BLOGGER
Need help? Contact to our support center at +92 308 477 4257
Name

Agriculture PPT Templates,2,AI Tools,1,Amazon,1,AskTipRicks,9,Blogger,48,Blogger-SEO,6,Blogger-Templates,1,Blogger-Tutorials,32,Blogger-Widgets,11,Blogging-Tips,7,Books,1,Business,1,Computer PPT Templates,1,Computer-Tutorials,1,Creative-PowerPoint-Templates,2,Digital Marketing,1,Domain,1,Ecommerce,1,Facebook,4,Free-Mobile-Data,1,Freenom,1,General,7,Google-Adsense,4,Google-Analytics,2,Google-Classroom,3,Instagram,2,Internet,1,Interviews,1,Islamic PPT Templates,1,jQuery,1,Marketing,1,Medical PPT Templates,1,Microsoft-Word,3,Mobile-Marketing,1,Motivation,1,MS Word,1,News,25,News-Updates,26,Oppo-Mobile-Features,1,PDF,1,PowerPoint-Templates,7,Resume-Templates,2,Reviews,3,SEO,8,Social-Media,6,Tech-News,15,TrueCaller,1,Twitter,1,Videos,24,Vlogging,1,Web-Hosting,1,Whatsapp,3,WordPress,8,WordPress-SEO,1,WordPress-Themes,1,WordPress-Tutorials,4,Youtube,5,
ltr
item
TipRicks Blog: How to Install Fasting Congratulations Pop Up Greetings Widget
How to Install Fasting Congratulations Pop Up Greetings Widget
TipRicks Blog
https://blog.tipricks.com/2019/09/how-to-install-fasting-congratulations.html
https://blog.tipricks.com/
https://blog.tipricks.com/
https://blog.tipricks.com/2019/09/how-to-install-fasting-congratulations.html
true
7070217950916442682
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy