flexdinesh / blogster Goto Github PK
View Code? Open in Web Editor NEWA collection of beautiful, accessible and performant Astro blog templates.
Home Page: https://blogster-sleek.netlify.com
License: MIT License
A collection of beautiful, accessible and performant Astro blog templates.
Home Page: https://blogster-sleek.netlify.com
License: MIT License
I really like this theme, It's a great work! But I have a little suggestion.
I initialize my repo by npm init -y
, but when I finished npx create-blogster@latest --theme sleek
, it shows help information below:
Start your development with:
- cd my-blogster-blog
- yarn dev
Do you think add detection of package is a worth doing for? Maybe support of pnpm can speed up initialization.
Hi @flexdinesh Great theme. Thanks for open sourcing it.
I have a small inconsistency problem with the title animation in mobile.
The background gradient doesn't seem to cover the entire text.
Reproducible in
OS: iOS
browser: safari
version : 16.1.1
theme: bubblegum
Happy to submit a PR
Hi, I created an astro plugin which allows to add Like buttons to blog posts.
Are you open to integrate it in your template? I can create a PR to setup the integration. It will be just a few line of code. I will make the integration optional, meaning that if the setting_key
is missing (the user doesn't want to use the plugin), nothing is affected and will change.
In general, the plugin allows to receive any kind of feedback, but I think for a blogsite likes are more appropriate. Nonetheless, it's very easy and customizable.
Let me know.
Thanks.
Hey, I really liked your Blogster Newspaper theme, and I was wondering if I had permission from you to remake it with newer Astro features like Markdoc integration and Content Collections? I'll credit you in the README, of course. I'll also publish it under a different name (I was thinking Journal).
It appears that this theme does not implement markdoc the same way that I would get if I ran
npx astro add markdoc
in a generic astro project, and that as a result some of the documentation at the Astro doesn't fully apply. As the todo list is locked, I cannot comment there. I'm trying to follow the advice given at
#70 to add footnote support, as that is not supported in the upstream Markdoc. I suspect that would be useful to more than just me, and might be something you want to consider for inclusion in the theme if it can be made to work.
The theme is actually complete in itself, but just lacks the search functionality. When the user creates a large amount of blogs, searching for the right one will be really hard. A search functionality can be really helpful for searching through the blogs. You might consider adding this, or can tell how to implement this in the website.
I have been using this icon pack for some time now. It contains Font Awesome, Material, and many others
https://github.com/natemoo-re/astro-icon
๐
I am looking at migrating from Hugo to Astro, because I am having trouble integrating Hugo with other tools. One feature I'm missing is that with Hugo I do not need to include dates on my posts, but can use the git commit information as part of the page generation to provide the page creation and modification dates. It would be great to have this functionality with Astro as well, but as I understand it, it would be an aspect of the theme? If I should file this feature request somewhere else please let me know.
Hi I'm very new to astro and was wondering if there's a way to get the markdown content itself to hot reload. The astro templates do hot reload when editing directly but not the blog content which I have to do a pge refresh to see. I'd love to edit the content with realtime updates to see how it would look like on prod instead of in my editor built in markdown preview tool (github styled)
Right after generating my Bubblegum site, I built it, only to get this error:
error Cannot read properties of undefined (reading 'postcss')
File:
D:\personal-site-astro\node_modules\@astrojs\tailwind\dist\index.js:78:22
Code:
77 | const tailwindConfig = (userConfig == null ? void 0 : userConfig.value) ?? getDefaultTailwindConfig(config.srcDir);
> 78 | config.style.postcss.plugins.push(tailwindPlugin(tailwindConfig));
| ^
79 | config.style.postcss.plugins.push(autoprefixerPlugin);
80 | if (applyBaseStyles) {
81 | injectScript("page-ssr", `import '@astrojs/tailwind/base.css';`);
Stacktrace:
TypeError: Cannot read properties of undefined (reading 'postcss')
at Object.astro:config:setup (file:///D:/personal-site-astro/node_modules/@astrojs/tailwind/dist/index.js:78:22)
at async withTakingALongTimeMsg (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/integrations/index.js:15:18)
at async runHookConfigSetup (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/integrations/index.js:69:7)
at async AstroBuilder.setup (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/core/build/index.js:40:21)
at async AstroBuilder.run (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/core/build/index.js:130:23)
at async build (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/core/build/index.js:21:3)
at async runCommand (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/cli/index.js:157:14)
at async cli (file:///C:/Users/mikwee/AppData/Local/Yarn/Data/global/node_modules/astro/dist/cli/index.js:180:5)
Does anybody have an idea of what's going on? Thanks.
just finished setting up through the video and reading documentation however Mason.confi gave me this error :
server "sumneko_lua" is not valid entry in ensure installed. makesure to only provid lspconfig server names
sumneko_lua just deprecated the name and change it to lua_ls
'vim' global undefined appearing everywhere there is vim in .lua files so is this not working?
lsp.configure('lua-ls', {
settings = {
Lua = {
diagnostics = {
globals = { 'vim' }
}
}
}
})
I think that this template is missing a table of content markdoc element.
How to reproduce:
npx create-blogster@latest --theme sleek
cd my-blogster-blog
yarn run dev --host
The page displays an error message:
require is not defined
/my-blogster-blog/.yarn/cache/prismjs-npm-1.29.0-6faa5b04b8-007a8869d4.zip/node_modules/prismjs/components/index.js:1:33
> 1 | const components = require('../components.js');
| ^
2 | const getLoader = require('../dependencies');
ReferenceError: require is not defined
at /.yarn/cache/prismjs-npm-1.29.0-6faa5b04b8-007a8869d4.zip/node_modules/prismjs/components/index.js:1:33
at instantiateModule (file:///my-blogster-blog/.yarn/__virtual__/vite-virtual-2b0880e296/0/cache/vite-npm-3.2.5-f23b9ecb5b-ad35b7008c.zip/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53364:15)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5
Other information:
Hello ๐๐ป ,
First of all congratulations for developing this template, is my favorite by far on astro!
As an idea it would be perfect to filter blog posts by tags as astro-paper template does.
Regards
I've noticed that in Chrome (macOS 109.0.5414.87) there is a flickering when navigating between pages only for the production build. In dev mode this doesn't seem to occur nor does it occur in Safari for the production build.
Here's a video showing the issue:
In the dev server everything works fine, but when I build the website, Tailwind CSS's styles aren't baked into the HTML, which means my site ends up with no styling. Why is that? Thanks.
List of things in pipeline for Blogster. I'll smash through them as and when I find time.
All themes:
Bubblegum:
before
border for h3 and higherSleek:
Newspaper:
after
border is not semantically correctHi,
using Demo: Newspaper
using the template via Astro
I'm using this template for my personal blog, And I realised that by just setting url
and title
in the .md
file, the correct codepen link will not appear
If you just wanted to change the line in the default articles, you won't see the new link by changing url and title.
{% codepen url="https://codepen.io/ruphaa/pen/eYJqjgq" title="Ecosystem - Pen in CSS by Ruphaa" /%}
according to the embedded link retried from codepen there are two other important fields which are data_slug_hash
and data_user
. and these two are hardcoded in the template.
When on Windows and creating a project with the command npx create-blogster@latest --theme sleek
, no content is displayed on either /blog
or /projects
. This seems to be an issue with globby trying to understand the result of path.join
npx create-blogster@latest --theme sleek
yarn dev
and view the live dev site in the browser at the given urlContent should be displayed properly regardless of platform
Globby documentation states that path.posix
must be explicitly used for all globby paths, windows paths will not work. path.join
will use path.win32
when on a Windows platform and therefore must be hard-coded to utilize path.posix
when using globby.
if someone have many ariticles, he will need a tag to classify articles.
$ yarn install
$ yarn build
(node:1009) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
(node:1009) ExperimentalWarning: Use `importAttributes` instead of `importAssertions`
(Use `node --trace-warnings ...` to show where the warning was created)
03:42:53 PM [build] output target: static
03:42:53 PM [build] Collecting build info...
03:42:53 PM [build] Completed in 26ms.
03:42:53 PM [build] Building static entrypoints...
03:42:54 PM [build] Completed in 1.17s.
building client
Completed in 19ms.
generating static routes
(node:1009) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
โถ src/pages/index.astro
โโ /index.html (+14ms)
โถ src/pages/projects.astro
โโ /projects/index.html (+7ms)
ฮป src/pages/rss.xml.ts
โโ /rss.xml (+11ms)
โถ src/pages/blog/[slug].astro
error require is not defined
ReferenceError: require is not defined
at file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:16921:3
at handleId (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:16696:14)
at loadComponentsInOrder (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:16718:5)
at Object.load (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:16864:13)
at loadLanguages (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:16910:45)
at ensureLoaded (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:17080:7)
at runHighlighterWithAstro (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:17089:5)
at AstroComponentInstance.factory (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:17108:35)
at AstroComponentInstance.init (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:838:29)
at AstroComponentInstance.render (file:///Users/tison/Brittani/nightsky-newspaper/dist/entry.mjs?time=1711957374648:843:18)
I'd love to see content
added to the RSS feed. In particular, I'd want to see the custom blogster components supported in that.
Right now, I'm just returning Markdoc.renderers.html(postContent)
as content
on the RSS feed. It's mostly fine but custom components like CodeBlock
and YouTubeEmbed
aren't rendered as normal html
. It would be nice to have that supported out of the box.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.