🔍 Improve SEO and User Experiences

This commit is contained in:
LittleSheep 2024-08-16 20:07:20 +08:00
parent 4464c6557a
commit 1cc5b72cb9
7 changed files with 33 additions and 9 deletions

10
app.vue
View File

@ -14,6 +14,16 @@ import "@unocss/reset/tailwind.css"
const theme = useTheme()
const auth = useUserinfo()
const { locale } = useI18n()
watch(locale, (value) => {
useHead({
htmlAttrs: {
lang: value,
},
})
}, { deep: true, immediate: true })
onMounted(() => {
theme.global.name.value = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"

View File

@ -16,12 +16,13 @@
<v-img
:src="`${config.public.solarNetworkApi}/cgi/files/attachments/${post.body?.thumbnail}`"
:aspect-ratio="16 / 9"
alt="Post thumbnail"
class="rounded-md"
cover
/>
</div>
<article v-if="post.type == 'story'" class="text-base prose mx-auto">
<article v-if="post.type == 'story' || props.forceShowContent" class="text-base prose max-w-none">
<m-d-c :value="post.body?.content"></m-d-c>
</article>
@ -52,6 +53,6 @@
</template>
<script setup lang="ts">
const props = defineProps<{ post: any }>()
const props = defineProps<{ post: any, forceShowContent?: boolean }>()
const config = useRuntimeConfig()
</script>

View File

@ -2,7 +2,7 @@
<v-carousel v-if="!loading" show-arrows="hover" cycle hide-delimiters progress="primary">
<v-carousel-item v-for="(item, i) in items" :key="i">
<v-sheet color="rgba(0, 0, 0, .4)" class="h-full w-full flex items-center justify-center post-container overflow-scroll">
<post-item class="mt-5 mb-2" :post="item" />
<post-item class="mt-5 mb-2" force-show-content :post="item" />
</v-sheet>
</v-carousel-item>
</v-carousel>

View File

@ -17,8 +17,8 @@
</v-col>
</v-row>
</v-sheet>
<v-img v-else-if="item.mimetype.split('/')[0] == 'image'" :src="getAttachmentUrl(item.id)" class="w-full h-full"
cover />
<v-img v-else-if="item.mimetype.split('/')[0] == 'image'" :src="getAttachmentUrl(item.id)" :alt="item.alt"
class="w-full h-full" cover />
<video v-else-if="item.mimetype.split('/')[0] == 'video'" :src="getAttachmentUrl(item.id)" class="w-full h-full"
controls />
<v-sheet v-else color="rgba(0, 0, 0, .4)" height="calc(100% + 24px)" class="p-5">

View File

@ -2,7 +2,7 @@
<v-app-bar flat color="primary" scroll-behavior="hide">
<v-container fluid class="mx-auto d-flex align-center justify-center px-8">
<nuxt-link to="/" exact>
<v-avatar class="me-4 ms-1" color="transparent" size="32" :image="Logo" />
<v-img class="me-4 ms-1" width="32" height="32" alt="Logo" :src="Logo" />
</nuxt-link>
<div class="nav-links overflow-y-auto flex">

View File

@ -27,7 +27,7 @@
</v-col>
<v-col cols="12" md="4" class="flex justify-end" order="first" order-md="last">
<div class="text-right flex flex-col items-end">
<h1 class="text-4xl font-bold">{{ t("indexActivities") }}</h1>
<h2 class="text-4xl font-bold">{{ t("indexActivities") }}</h2>
<p class="text-lg mt-3 max-w-2/3">
{{ t("indexActivitiesCaption") }}
</p>
@ -46,6 +46,20 @@ import { getLocale } from "~/utils/locale"
const { t } = useI18n()
useHead({
title: t("brandName"),
})
useSeoMeta({
title: t("brandName"),
description: t("indexIntroduce"),
ogTitle: t("brandName"),
ogDescription: t("indexIntroduce"),
ogUrl: useRuntimeConfig().public.siteUrl,
ogType: "website",
ogSiteName: "Solsynth Capital",
})
const { data: products } = await useAsyncData("products", () => {
return queryContent("/products").where({ _locale: getLocale(), archived: { $ne: true } }).limit(5).find()
})

View File

@ -66,12 +66,11 @@ export default defineEventHandler(async (event) => {
})
}
setResponseHeader(event, "Content-Type", "application/rss+xml")
switch (queries.type) {
case "json":
return feed.json1()
case "rss":
setResponseHeader(event, "Content-Type", "application/rss+xml; charset=utf-8")
return feed.rss2()
default:
return feed.atom1()