Merge pull request #279 from rico-vz/ad-refactor

Ad refactor

.git-blame-ignore-revs

@@ -8,3 +8,4 @@ a1713c2f67dc8fcb83b8a54013b74859ff93f076
 016a0c75837e666dcc6d04ccbf109ab47618f3dc
 fb5b8f82813a6ab7122b482db546be37237045ee
 e3ec9b4abafdeb1eb7550fb7714dfca488be466c
+c5094aa91a8defd998c305710e1578923f3cf69f

config/ads.php

@@ -0,0 +1,22 @@
+<?php
+
+return [
+    /*
+    |--------------------------------------------------------------------------
+    | AdSense Settings
+    |--------------------------------------------------------------------------
+    |
+    | This file contains the configuration for Google AdSense on Heimerdinger.lol
+    |
+    */
+
+    'client_id' => 'ca-pub-4505764048662657',
+
+    'slots' => [
+        'horizontal_banner' => '9840151408',
+        'vertical_banner' => '9117294343',
+        'in_article' => '7169787855',
+        'rectangle' => '1917461172',
+        'common' => '4128691547',
+    ],
+];

resources/css/app.css

@@ -153,3 +153,14 @@
 ins.adsbygoogle[data-ad-status="unfilled"] {
     display: none !important;
 }
+
+.ad-container {
+    overflow: hidden;
+    width: 100%;
+    max-width: 100%;
+}
+
+.ad-container ins.adsbygoogle {
+    background-color: rgba(0, 0, 0, 0.02);
+    border-radius: 4px;
+}

resources/views/assets/index.blade.php

@@ -5,11 +5,6 @@
     'Explore game assets on Heimerdinger.LoL. Find detailed information on all icons and emotes
     available in League of Legends!')
 
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
-
 @section('content')
 
     <h1
@@ -19,9 +14,6 @@
         class="text-lg font-bold text-center text-transparent uppercase bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
         LoL Icons & Emotes</h2>
 
-    <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" data-ad-slot="1526464654"
-        data-ad-format="auto" data-full-width-responsive="true"></ins>
-
     <div class="container flex items-center justify-center flex-grow p-4 mx-auto mt-3">
         <div class="items-center justify-center text-center align-middle">
             <img class="items-center mx-auto" src="{{ asset('img/heimerdinger-emote.webp') }}" alt="Heimerdinger Emote">
@@ -44,9 +36,3 @@
 
 
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/champions/index.blade.php

@@ -7,8 +7,6 @@
 
     @push('top_scripts')
         @vite('resources/js/lane-filter.js')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
     @endpush
 
 @section('content')
@@ -17,7 +15,4 @@
 
 @push('bottom_scripts')
     @include('popper::assets')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
 @endpush

resources/views/components/ads/common.blade.php

@@ -0,0 +1,7 @@
+<div class="mx-auto my-6 text-center ad-container common-ad">
+    <ins class="adsbygoogle" style="display:block" data-ad-client="{{ config('ads.client_id') }}"
+        data-ad-slot="{{ config('ads.slots.rectangle') }}" data-ad-format="auto" data-full-width-responsive="true"></ins>
+    <script>
+        (adsbygoogle = window.adsbygoogle || []).push({});
+    </script>
+</div>

resources/views/components/ads/horizontal-banner.blade.php

@@ -0,0 +1,8 @@
+<div class="mx-auto my-6 text-center ad-container horizontal-banner">
+    <ins class="adsbygoogle" style="display:block" data-ad-client="{{ config('ads.client_id') }}"
+        data-ad-slot="{{ config('ads.slots.horizontal_banner') }}" data-ad-format="auto"
+        data-full-width-responsive="true"></ins>
+    <script>
+        (adsbygoogle = window.adsbygoogle || []).push({});
+    </script>
+</div>

resources/views/components/ads/in-article.blade.php

@@ -0,0 +1,7 @@
+<div class="mx-auto my-6 text-center ad-container in-article-ad">
+    <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid"
+        data-ad-client="{{ config('ads.client_id') }}" data-ad-slot="{{ config('ads.slots.in_article') }}"></ins>
+    <script>
+        (adsbygoogle = window.adsbygoogle || []).push({});
+    </script>
+</div>

resources/views/components/ads/vertical-banner.blade.php

@@ -0,0 +1,8 @@
+<div class="my-4 text-center ad-container vertical-banner">
+    <ins class="adsbygoogle" style="display:block" data-ad-client="{{ config('ads.client_id') }}"
+        data-ad-slot="{{ config('ads.slots.vertical_banner') }}" data-ad-format="auto"
+        data-full-width-responsive="true"></ins>
+    <script>
+        (adsbygoogle = window.adsbygoogle || []).push({});
+    </script>
+</div>

resources/views/components/champions/grid_info.blade.php

@@ -37,7 +37,8 @@
                         <span class="font-bold">Popular Positions:</span>
                         @if (isset($champion->lanes) && isset($champion->lanes->roles))
                             @foreach ($champion->lanes->roles as $lane)
-                                <span class="inline-block lowercase capitalize-first">{{ $lane }} @svg(getRoleIconSvg($lane), 'w-5 h-5 inline-block')
+                                <span class="inline-block lowercase capitalize-first">{{ $lane }}
+                                    @svg(getRoleIconSvg($lane), 'w-5 h-5 inline-block')
                                     @if (!$loop->last)
                                         -
                                     @endif
@@ -150,6 +151,7 @@
                 <div class="p-4">
                     <h4 class="text-center text-xl font-semibold text-neutral-100 uppercase mt-2.5 shadow-sm">
                         {{ $champion->name }} Lore</h4>
+                    <x-ads.in-article />
                     <p class="text-neutral-100 hyphens-auto text-base mt-2.5 leading-loose w-9/12 mx-auto"
                         lang="en">
                         {{ $champion->lore }}
@@ -161,8 +163,6 @@
 </section>
 @push('top_scripts')
     @vite('resources/js/lane-filter.js')
-    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-        crossorigin="anonymous"></script>
 @endpush
 @push('bottom_scripts')
     @include('popper::assets')

resources/views/components/champions/list_all.blade.php

@@ -11,13 +11,14 @@
             Champions
         </h1>
 
-        <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" data-ad-slot="7031271888"
-            data-ad-format="auto" data-full-width-responsive="true"></ins>
-
         <div class="flex justify-center items-center mx-auto max-w-5xl mt-2.5">
             <x-champions.lane-selector class="text-center" />
         </div>
 
+        <div class="flex justify-center my-4">
+            <x-ads.horizontal-banner />
+        </div>
+
         <div class="container flex items-center justify-center p-4 mx-auto mt-3">
             <div class="grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
                 @foreach ($champions as $key => $champion)

resources/views/components/emotes/list_all.blade.php

@@ -9,12 +9,12 @@
 
     <x-emotes.searchbar />
 
-    <div class="max-w-lg mx-auto mt-4 text-center">
-        <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" data-ad-slot="7852517087"
-            data-ad-format="auto" data-full-width-responsive="true"></ins>
-    </div>
-
     <div class="container flex items-center justify-center p-4 mx-auto mt-3">
+
+        <div class="hidden md:block md:mr-6">
+            <x-ads.vertical-banner />
+        </div>
+
         <div class="grid grid-cols-2 gap-6 md:grid-cols-3 lg:grid-cols-6">
 
             @foreach ($emotes as $key => $emote)

resources/views/components/home/features.blade.php

@@ -84,9 +84,9 @@
                     information about the game.
                 </p>
             </a>
-            <div></div>
+        </div>
-            <ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-eg-k+31-7n+8n"
+        <div class="w-full mt-12">
-                data-ad-client="ca-pub-4505764048662657" data-ad-slot="4356125202"></ins>
+            <x-ads.horizontal-banner />
         </div>
     </div>
 </section>

resources/views/components/icons/list_all.blade.php

@@ -7,14 +7,12 @@
         class="text-3xl font-bold text-center text-transparent uppercase sm:text-4xl bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
         Summoner Icons</h1>
     <x-icons.searchbar />
-
-    <div class="max-w-lg mx-auto mt-4 text-center">
-        <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4505764048662657" data-ad-slot="7852517087"
-            data-ad-format="auto" data-full-width-responsive="true"></ins>
-    </div>
-
     <div class="container flex items-center justify-center p-4 mx-auto mt-3">
 
+        <div class="hidden md:block md:mr-6">
+            <x-ads.vertical-banner />
+        </div>
+
         <div class="grid grid-cols-2 gap-12 md:grid-cols-3 lg:grid-cols-6">
 
             @foreach ($icons as $key => $icon)

resources/views/components/icons/view_grid.blade.php

@@ -102,13 +102,6 @@
                         </ul>
                     </div>
                 </div>
-
-                <div
-                    class="items-center col-span-2 border shadow-sm rounded-2xl bg-stone-800/40 border-neutral-300/5 shadow-stone-800/80 !hidden lg:!block justify-center">
-                    <ins class="!flex justify-center adsbygoogle rounded-2xl" style="display:block" data-ad-client="ca-pub-4505764048662657"
-                        data-ad-slot="4667687216" data-ad-format="auto" data-full-width-responsive="true"></ins>
-                </div>
-
             </div>
         </div>
     </div>

resources/views/components/sales/current_sales.blade.php

@@ -46,8 +46,6 @@
                 </div>
             </a>
         @endforeach
-        <ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-7t+ey-1j-38+br"
-            data-ad-client="ca-pub-4505764048662657" data-ad-slot="1195346069"></ins>
     </div>
 
 

resources/views/components/skins/paginatedlist.blade.php

@@ -8,12 +8,9 @@
         Champion Skins</h1>
     <x-skins.searchbar />
 
-    <ins class="adsbygoogle"
+    <div class="flex justify-center my-4">
-     style="display:block"
+        <x-ads.horizontal-banner />
-     data-ad-client="ca-pub-4505764048662657"
+    </div>
-     data-ad-slot="4300903438"
-     data-ad-format="auto"
-     data-full-width-responsive="true"></ins>
 
     @fragment('skin-list')
         <div id="skin-list">

resources/views/emotes/index.blade.php

@@ -4,17 +4,6 @@
 @section('description',
     'Explore all LoL Emotes on Heimerdinger.LoL. Find detailed information on popular emotes such as
     Dab Pengu, Bee Mad, Little Camper, Super Shy, PENGUMODE and more!')
-
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
 @section('content')
     <x-emotes.list_all :emotes="$emotes" />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/home.blade.php

@@ -5,11 +5,6 @@
     'Explore League of Legends champions, skins, and game assets on Heimerdinger.
     Your ultimate source for in-depth information on LoL gaming. Dive in now!')
 
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
-
 @section('content')
     <x-home.features />
 
@@ -18,9 +13,3 @@
     @endif
     <x-home.recent_skins :latestSkins="$latestSkins" />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/icons/index.blade.php

@@ -5,17 +5,6 @@
     'Explore all LoL icons on Heimerdinger.LoL. Find detailed information on popular summoner icons
     such as Qiyana Champie 2, Omen of the Cursed Revenant, Lil\' Sprout, Dominion Retirement, Winterblessed Hwei and more!')
 
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
-
 @section('content')
     <x-icons.list_all :icons="$icons" />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/icons/show.blade.php

@@ -3,16 +3,6 @@
 @section('title', $icon->title . ' • Heimerdinger')
 @section('description', 'Heimerdinger.LoL: ' . $icon->title . ' details showing all the information about the icon
     released in ' . $icon->release_year . '. ' . substr($icon->description, 0, 64) . '...')
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
 @section('content')
     <x-icons.view_grid :icon="$icon" />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/layouts/app.blade.php

@@ -52,6 +52,10 @@
 
     @vite(['resources/css/app.css', 'resources/js/app.js'])
 
+    <!-- Google AdSense -->
+    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client={{ config('ads.client_id') }}"
+        crossorigin="anonymous"></script>
+
     @stack('top_scripts')
     <x-analytics.plausible />
 </head>
@@ -59,6 +63,7 @@
 <body class="antialiased bg-stone-900 dark scroll-smooth">
     <x-navbar />
     @yield('content')
+    <x-ads.common />
     <x-footer />
     @stack('bottom_scripts')
 </body>

resources/views/posts/show.blade.php

@@ -14,11 +14,6 @@
     <meta name="googlebot" content="index, follow">
 @endpush
 
-@push('top_scripts')
-    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-        crossorigin="anonymous"></script>
-@endpush
-
 @section('content')
     <a href="{{ route('posts.index') }}"
         class="block mt-8 text-sm font-medium text-center text-orange-400 uppercase hover:underline">Back
@@ -40,22 +35,15 @@
             <h2 class="text-sm italic text-center text-orange-400 not-prose" itemprop="description">
                 “{{ $post->description }}”
             </h2>
-            <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article"
+            <x-ads.in-article />
-                data-ad-format="fluid" data-ad-client="ca-pub-4505764048662657" data-ad-slot="2492379195"></ins>
             <p>
                 {{ $post->contents }}
             </p>
+            <x-ads.in-article />
             <p class="mt-3 text-sm text-center">
                 Tagged with: <span itemprop="keywords" class="italic">
                     {{ isset($post->tags) ? implode(', ', $post->tags) : 'League of Legends' }}</span>
             </p>
-
         </div>
     </article>
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush

resources/views/sales/index.blade.php

@@ -5,18 +5,7 @@
     'Explore the current LoL Sale on Heimerdinger.LoL. Find detailed information on what champions
     and skins are currently on sale and grab a good deal!')
 
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
-
 @section('content')
     <x-sales.current_sales :sales="$sales" />
     <x-buymeacoffee.floating />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-    (adsbygoogle = window.adsbygoogle || []).push({});
-</script>
-@endpush

resources/views/skins/index.blade.php

@@ -5,17 +5,6 @@
     'Explore all champion skins on Heimerdinger.LoL. Find detailed information on popular skins
     such as Dark Cosmic Jhin, HEARTSTEEL Ezreal, PROJECT: Vayne and more!')
 
-    @push('top_scripts')
-        <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4505764048662657"
-            crossorigin="anonymous"></script>
-    @endpush
-
 @section('content')
     <x-skins.paginatedlist :skins="$skins" :rarity-color="$rarityColor" />
 @endsection
-
-@push('bottom_scripts')
-    <script>
-        (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-@endpush