Forem: IamArpain

How to Add Sticky Footer Ads to Your Website

IamArpain — Wed, 13 Apr 2022 13:42:00 +0000

Sticky footer Ads is new way of increasing your Ad revenue. Even Google Auto Ads is using similar kind of Ads in Bottom page of your website. So In this article, I will be sharing Simplest Method To Add Responsive Footer Sticky Ads in WordPress and Sticky Footer Ads in Blogger Website.

Benefits Of Placing Sticky Footer Ads on your Website

Footer Sticky Ads have more AdSense ads visibility that increase CTR & revenue.
Get More affiliate clicks if you place button that directly increase your commission.
Best place for banner placement for your third party advertiser & you can charge more for visibility.
Sticky Ads are Visitor friendly & visitor can close the ad if they feel annoying.
Fast Loading of ads on your site without impacting website speed & user experience.

Add Sticky Ads in WordPress Blog

Best part of WordPress is you can always search for Plugins to do your task.

Below are some plugins to ad Sticky footer ads in your WordPress blog.

Ad Inserter
Sticky Ads
Advanced Ads
Q2W3 Fixed Widget plugin (Sticky widget)
and many more.

You can Search more plugins in WordPress plugin section and try for free.

Now, If you want to implement using CSS Code then need to follow some steps and proper code to add sticky footer ads to your website.

Add Sticky Footer Ads Html CSS code

If you want to use Html and CSS code to add bottom sticky ads then you can refer below detail article.

Learn with proper steps - Add Sticky Footer Ads Blogger

Things to Consider Before Implementation

I know that, you are super excited to add sticky footer Ads in your blog to increase your revenue. But, before that you should read the following rules. Otherwise, your Adsense account will be banned.

For more you can check out: Floating bottom Ads in blogger

Are you there?

I hope you like this article.

Thanks for reading. Follow for more valuable content for bloggers.

See you in new articles.

Create Responsive Table using HTML and CSS Only

IamArpain — Fri, 08 Apr 2022 12:16:48 +0000

Many website using Responsive table using HTML and CSS Only, So do you want to add responsive table to your website?

Yes!

When writing a long posts sometimes we need to use responsive table to explain things in a better way. Tables help to understand easily for the readers.

A responsive table will display its content horizontal scroll bar if the screen is too small to display the full content. Resize the browser window as per device size.

Great!

Now, time to provide you Responsive Table using HTML and CSS Only.

So let's start.

Responsive Table HTML Code

<div>
 <table class="restable">
<caption class="rescap">Simple Responsive Data Table</caption>
<tbody>
<tr>
<th class="resth">Name</th>
  <th class="resth">Score</th>   
  <th class="resth">Status</th>
  </tr>

<tr class="restr">                                      
  <td data-label="Name" class="restd">Ravi</td>
  <td data-label="Marks" class="restd">178</td>
  <td data-label="Status" class="restd">Pass</td>
  </tr>
<tr class="restr"> 
  <td data-label="Name" class="restd">Prem</td>
  <td data-label="Marks" class="restd">169</td>
  <td data-label="Status" class="restd">Pass</td>
  </tr>
<tr class="restr"> 
  <td data-label="Name" class="restd">Alex</td>
  <td data-label="Marks" class="restd">97</td>
  <td data-label="Status" class="restd">Fail</td>
  </tr>
<tr class="restr"> 
  <td data-label="Name" class="restd">Gale</td>
  <td data-label="Marks" class="restd">120</td>
  <td data-label="Status" class="restd">Pass</td>
  </tr>
</tbody></table>
</div>

Responsive Table using Pure CSS Only

/*CSS for Responsive Table By technicalarp.com*/
  .restable
   {border-collapse:collapse;
   width:100%;
   overflow: hidden;
   }
   .rescap{
     border-left:4px solid #009879;
     padding:15px;
 font-family:georgia;
 font-weight:bold;
 font-size:20px;
 background-color:#dddddd;
 color:#990a00;
 text-align:left;
 overflow:hidden;
 margin-bottom:4px;
 width:100%;
 }
.resth{ 
    padding:12px 15px;
    background-color:#009879;
    color:#ffffff;
    font-family:georgia;
    font-size:20px;
    font-weight:bold;
    border:1px solid #dddddd;
    text-align:center;
    }
.restr{
    border:1px solid #dddddd;}
 .restd{padding:12px 15px;
    font-family:arial;
    font-size:20px;
    text-align:center;
    border:1px solid #dddddd;
    }
.restr:last-of-type{
    border-bottom: 2px solid #009879;
    }
.restr:nth-of-type(even){
    background-color: #f3f3f3;
    }

If the above table work for you then congrats, and if not why not try another code.

Do you Want to try 5+ Responsive Table Code?

You can find Bootstrap table code, Pure CSS code and many more visit: Add Responsive Table In Blogger

Again, Thanks for visiting. Follow for more upcoming amazing content.

See you in new valuable content.

404 Error Page HTML Templates Design

IamArpain — Thu, 07 Apr 2022 14:56:26 +0000

Implementing a custom amazing animated 404 page can be an effective way to retain visits from people who have found a dead link to your site.

Showing your creativity to build animated 404 error page templates will definitely help you.

Because 404 Page Error or Not Found error is displayed when you go to a page that doesn’t exist within an active website. One of the most common errors you can come across while browsing the Internet is a 404 or Page Not Found error.

Many websites are using 404 error page templates interactive so user will at least find it interesting and won't leave your website.

So now, below are some amazing, simple and animated 404 error page HTML Templates.

So, For more amazing list visit: 404 Error Page HTML Templates Download

Thanks for visiting. Follow for more upcoming amazing content.

Forem: IamArpain

How to Add Sticky Footer Ads to Your Website

Benefits Of Placing Sticky Footer Ads on your Website

Add Sticky Ads in WordPress Blog

Add Sticky Footer Ads Html CSS code

Things to Consider Before Implementation

Create Responsive Table using HTML and CSS Only

Responsive Table HTML Code

Responsive Table using Pure CSS Only

404 Error Page HTML Templates Design

List of 404 Error Page HTML Templates

Yeti 404 Page

Mars 404 Error Page

Animation 404 Error Page

Pure CSS 404 Error Page