diff --git a/README.md b/README.md new file mode 100644 index 0000000..df430a7 --- /dev/null +++ b/README.md @@ -0,0 +1,21 @@ +# WordPress-Fetch-Posts + +A proof of concept on how to fetch posts from WordPress using the WordPress API, and append them to your website, using vanilla JavaScript. +The HTML markup uses [Tailwind CSS](https://tailwindcss.com/) just to make it look a bit prettier, but the logic itself is pure JavaScript. + +The logic itself can be found in `blog.js`, which ties into `blog.html`. +Modifying the first few variables in `blog.js` should be enough to get you started with your own page. + +You can find an example of this running "live" on: [wptest.thomassen.dev](https://wptest.thomassen.dev/blog.html) + +## View more button + +One thing to note is that the "View more" button gets hidden using a CSS class called `hidden`, which is included in [Tailwind CSS](https://tailwindcss.com/docs/display#hidden). + +If you're not using Tailwind CSS, or any other CSS framework that has a `hidden` class, you can add the following CSS: + +```css +.hidden { + display: none; +} +``` \ No newline at end of file diff --git a/blog.html b/blog.html index 56e364d..dad8219 100644 --- a/blog.html +++ b/blog.html @@ -7,9 +7,13 @@