Google adsense implementation

This commit is contained in:
Čarodej
2022-02-07 17:47:29 +01:00
parent 81362fef2d
commit 09774b1d48
9 changed files with 162 additions and 13 deletions
@@ -33,6 +33,10 @@ export default {
title: this.$t('admin_settings.tabs.appearance'),
route: 'AppAppearance',
},
{
title: this.$t('Adsense'),
route: 'AppAdsense',
},
{
title: this.$t('Homepage'),
route: 'AppIndex',
@@ -0,0 +1,115 @@
<template>
<PageTab>
<!--Adsense basic setup-->
<div v-if="adsense" class="card shadow-card">
<FormLabel>
{{ $t('Basic Setup') }}
</FormLabel>
<AppInputSwitch
:title="$t('Allow Google Adsense')"
:description="$t('Allow ads on app pages.')"
>
<SwitchInput
@input="$updateText('/admin/settings', 'allowed_adsense', adsense.allowedService)"
v-model="adsense.allowedService"
class="switch"
:state="adsense.allowedService"
/>
</AppInputSwitch>
<AppInputText :title="$t('Client Id')" :description="$t('Paste your Adsense Client ID e.g. ca-pub-XXXXXXXXXXXXXXXXX')" :is-last="true">
<input
@input="$updateText('/admin/settings', 'adsense_client_id', adsense.clientId, true)"
v-model="adsense.clientId"
:placeholder="$t('Client Id...')"
type="text"
class="focus-border-theme input-dark"
/>
</AppInputText>
</div>
<!--Adsense places-->
<div v-if="adsense" class="card shadow-card">
<FormLabel>
{{ $t('Ads') }}
</FormLabel>
<AppInputText :title="$t('File Viewport Banner')" :description="$t('This banner will be showed above user files')">
<textarea
rows="3"
@input="$updateText('/admin/settings', 'adsense_banner_01', adsense.banner01, true)"
v-model="adsense.banner01"
:placeholder="$t('Paste the <ins></ins> tag here...')"
type="text"
class="focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('Download Page Banner')" :description="$t('This banner will be showed below file download page')">
<textarea
rows="3"
@input="$updateText('/admin/settings', 'adsense_banner_02', adsense.banner02, true)"
v-model="adsense.banner02"
:placeholder="$t('Paste the <ins></ins> tag here...')"
type="text"
class="focus-border-theme input-dark"
/>
</AppInputText>
<AppInputText :title="$t('Homepage Banner')" :description="$t('This banner will be showed on the homepage')" :is-last="true">
<textarea
rows="3"
@input="$updateText('/admin/settings', 'adsense_banner_03', adsense.banner03, true)"
v-model="adsense.banner03"
:placeholder="$t('Paste the <ins></ins> tag here...')"
type="text"
class="focus-border-theme input-dark"
/>
</AppInputText>
</div>
</PageTab>
</template>
<script>
import SwitchInput from '../../../../components/Others/Forms/SwitchInput'
import AppInputButton from '../../../../components/Admin/AppInputButton'
import AppInputSwitch from '../../../../components/Admin/AppInputSwitch'
import FormLabel from '../../../../components/Others/Forms/FormLabel'
import AppInputText from '../../../../components/Admin/AppInputText'
import PageTab from '../../../../components/Others/Layout/PageTab'
import { mapGetters } from 'vuex'
export default {
name: 'Adsense',
components: {
AppInputButton,
AppInputSwitch,
AppInputText,
SwitchInput,
FormLabel,
PageTab,
},
computed: {
...mapGetters(['config']),
},
data() {
return {
adsense: {
allowedService: undefined,
clientId: undefined,
banner01: undefined,
},
}
},
created() {
this.adsense = {
allowedService: this.config.allowedAdsense,
clientId: this.config.adsenseClientId,
banner01: this.config.adsenseBanner01,
banner02: this.config.adsenseBanner02,
banner03: this.config.adsenseBanner03,
}
},
}
</script>
+4 -1
View File
@@ -10,11 +10,14 @@
<!--VueFileManager ScreenShot-->
<HeroScreenshot />
<!--Google Adsense banner-->
<div v-if="config.allowedAdsense" v-html="config.adsenseBanner01" class="min-h-[120px] mb-5"></div>
<!--Main Features-->
<MainFeatures />
<!--Pricing Tables-->
<!-- <PricingTables v-if="config.isSaaS" />-->
<!--<PricingTables v-if="config.isSaaS" />-->
<!--Get Started Call To Action-->
<GetStarted />
+8 -2
View File
@@ -32,11 +32,17 @@
<SidebarNavigation />
<PanelNavigationFiles />
<div @contextmenu.prevent.capture="contextMenu($event, undefined)" class="transition-transform duration-200 lg:grid lg:flex-grow lg:content-start lg:px-3.5">
<div
@contextmenu.prevent.capture="contextMenu($event, undefined)"
class="transition-transform duration-200 lg:grid lg:flex-grow lg:content-start lg:px-3.5"
>
<DesktopToolbar />
<MobileToolbar />
<!--Google Adsense banner-->
<div v-if="config.allowedAdsense" v-html="config.adsenseBanner01" class="min-h-[120px] mb-5"></div>
<!--File list & info sidebar-->
<div class="flex space-x-3 lg:overflow-hidden">
<router-view id="file-view" class="relative w-full" :key="$route.fullPath" />
@@ -96,7 +102,7 @@ export default {
DragUI,
},
computed: {
...mapGetters(['isVisibleSidebar', 'isLimitedUser']),
...mapGetters(['isVisibleSidebar', 'isLimitedUser', 'config']),
},
data() {
return {
@@ -1,11 +1,14 @@
<template>
<div class="flex h-screen items-center justify-center">
<div>
<div class="w-full text-center">
<ItemGrid v-if="sharedFile" :entry="sharedFile" :highlight="true" :mobile-handler="true" />
<ButtonBase @click.native="download" button-style="theme">
<ButtonBase @click.native="download" button-style="theme" class="mx-auto">
{{ $t('page_shared.download_file') }}
</ButtonBase>
<!--Google Adsense banner-->
<div v-if="config.allowedAdsense" v-html="config.adsenseBanner01" class="min-h-[120px] mt-5"></div>
</div>
</div>
</template>
@@ -22,7 +25,7 @@ export default {
ItemGrid,
},
computed: {
...mapGetters(['sharedDetail', 'sharedFile']),
...mapGetters(['sharedDetail', 'sharedFile', 'config']),
},
methods: {
download() {