Make StarlightBlog work with StarlightImageZoom (#28866)

**Description**
<!--
Please include a summary of the change and which issue is fixed. Please
also include relevant motivation and context. List any dependencies that
are required for this change.
-->
⚒️ Fixes  images on blog sites cannot be zoomed

I think there is a problem with Images on Blog Pages (I have not found
any, but if there is one, it would not be possible to zoom the
image...).

This is because the MarkdownContent.astro cannot be overridden by the
Image plugin because the Blog already overrid it...
This is also probably the reason, why there is a comment in your code,
which says, that the Image Zoom plugin should not be before the Blog
plugin, because otherwise, the blog page would be scuffed, because the
author and all other metadata cannot be overriden anymore, because the
Image Zoom plugin already overrid the MarkdownContent.astro

I hope this helps.

Have a nice day, bye!

**⚙️ Type of change**

- [x] ⚙️ Feature/App addition
- [x] 🪛 Bugfix
- [ ] ⚠️ Breaking change (fix or feature that would cause existing
functionality to not work as expected)
- [ ] 🔃 Refactor of current code

**🧪 How Has This Been Tested?**
<!--
Please describe the tests that you ran to verify your changes. Provide
instructions so we can reproduce. Please also list any relevant details
for your test configuration
-->

On my own project (https://blog.trueberryless.org)

**📃 Notes:**
<!-- Please enter any other relevant information here -->

I have created around 10 PRs in different repositories where all of them
have the same issue, my own repo from one week ago included...

**✔️ Checklist:**

- [ ] ⚖️ My code follows the style guidelines of this project
- [ ] 👀 I have performed a self-review of my own code
- [ ] #️⃣ I have commented my code, particularly in hard-to-understand
areas
- [ ] 📄 I have made corresponding changes to the documentation
- [ ] ⚠️ My changes generate no new warnings
- [ ] 🧪 I have added tests to this description that prove my fix is
effective or that my feature works
- [ ] ⬆️ I increased versions for any altered app according to semantic
versioning
- [ ] I made sure the title starts with `feat(chart-name):`,
`fix(chart-name):` or `chore(chart-name):`
- [x] I have edited all files on GitHub web performed no tests and
didn't even try to run the code :) I'm just here to help and give a hint
how it could work.

** App addition**

If this PR is an app addition please make sure you have done the
following.

- [ ] 🖼️ I have added an icon in the Chart's root directory called
`icon.png`

---

_Please don't blindly check all the boxes. Read them and only check
those that apply.
Those checkboxes are there for the reviewer to see what is this all
about and
the status of this PR with a quick glance._

---------

Signed-off-by: trueberryless <99918022+trueberryless@users.noreply.github.com>
This commit is contained in:
trueberryless
2024-11-05 19:19:32 +01:00
committed by GitHub
parent 903b98e0ca
commit b6396cdaac
2 changed files with 9 additions and 1 deletions
+1 -1
View File
@@ -91,6 +91,7 @@ export default defineConfig({
components: {
Header: "./src/components/CustomHeader.astro",
Hero: "./src/components/CustomHero.astro",
MarkdownContent: "./src/components/CustomMarkdownContent.astro",
},
plugins: [
starlightBlog({
@@ -100,7 +101,6 @@ export default defineConfig({
recentPostCount: 10,
authors: authors,
}),
// Do not put that before starlightBlog
starlightImageZoom(),
starlightLinksValidator({
errorOnRelativeLinks: false,
@@ -0,0 +1,8 @@
---
import type { Props } from '@astrojs/starlight/props'
import Default from "starlight-blog/overrides/MarkdownContent.astro"
import ImageZoom from 'starlight-image-zoom/components/ImageZoom.astro'
---
<ImageZoom />
<Default {...Astro.props}><slot /></Default>