├── .gitignore ├── .wordpress-config.json ├── LICENSE ├── README.md ├── gatsby-config.js ├── package.json ├── siteConfig.js ├── src └── @draftbox-co │ └── gatsby-wordpress-balsa-theme │ └── components │ ├── disqus.jsx │ └── fb-comments.jsx ├── starters.yaml ├── static ├── cover.jpg ├── cover.png ├── cover_1.png ├── facebookImage.jpg ├── facebookImage.png ├── favicon.ico ├── favicon.png ├── favicon1.png ├── favicon_1.png ├── images │ └── logo.svg ├── logo.png ├── robots.txt ├── static │ └── favicon.png └── twitterImage.png └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | # Node template 2 | 3 | # Logs 4 | logs 5 | *.log 6 | npm-debug.log* 7 | yarn-debug.log* 8 | yarn-error.log* 9 | 10 | # Runtime data 11 | pids 12 | *.pid 13 | *.seed 14 | *.pid.lock 15 | 16 | # Directory for instrumented libs generated by jscoverage/JSCover 17 | lib-cov 18 | 19 | # Coverage directory used by tools like istanbul 20 | coverage 21 | 22 | # nyc test coverage 23 | .nyc_output 24 | 25 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 26 | .grunt 27 | 28 | # Bower dependency directory (https://bower.io/) 29 | bower_components 30 | 31 | # node-waf configuration 32 | .lock-wscript 33 | 34 | # Compiled binary addons (https://nodejs.org/api/addons.html) 35 | build/Release 36 | 37 | # Dependency directories 38 | node_modules/ 39 | jspm_packages/ 40 | 41 | # Typescript v1 declaration files 42 | typings/ 43 | 44 | # Optional npm cache directory 45 | .npm 46 | 47 | # Optional eslint cache 48 | .eslintcache 49 | 50 | # Optional REPL history 51 | .node_repl_history 52 | 53 | # Output of 'npm pack' 54 | *.tgz 55 | 56 | # Yarn Integrity file 57 | .yarn-integrity 58 | 59 | # dotenv environment variables file 60 | .env 61 | .ghost.json 62 | 63 | # IDE 64 | .idea/* 65 | *.iml 66 | *.sublime-* 67 | 68 | # OSX 69 | .DS_Store 70 | .vscode 71 | 72 | # Docs Custom 73 | .cache/ 74 | public 75 | yarn-error.log 76 | .netlify/ 77 | 78 | .env.* 79 | -------------------------------------------------------------------------------- /.wordpress-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "baseUrl": "wordpress.theasdfghjkl.com", 3 | "protocol": "https", 4 | "hostingWPCOM": false, 5 | "useACF": true, 6 | "includedRoutes": [ 7 | "**/categories", 8 | "**/posts", 9 | "**/pages", 10 | "**/media", 11 | "**/tags", 12 | "**/taxonomies", 13 | "**/users" 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 [Draftbox](https://draftbox.co) 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | [![Draftbox](https://res.cloudinary.com/thinkcdnimages/image/upload/v1589291053/Draftbox/draftbox-for-github.svg)](https://draftbox.co) 2 | 3 | # gatsby-wordpress-balsa-starter 4 | 5 | A Gatsby starter for creating blogs from headless WordPress CMS with Balsa theme from Draftbox. 6 | 7 | Turn your WordPress blog into a lightning fast static website. This Gatsby theme is a frontend replacement of the WordPress engine featuring the Balsa theme skin and functionality. All content is sourced from a headless WordPress CMS. 8 | 9 | > This starter is being used at [Draftbox](https://draftbox.co). Get lightning fast, secure front-end for your WordPress or Ghost blog, in 5 minutes or less, without coding. For our fellow devs, we also provide code export feature. 10 | 11 | ## Demo 12 | 13 | Play with the [Demo](https://wp-balsa-preview.draftbox.co) to get a first impression. 14 | 15 | ## Features 16 | 17 | - Balsa Skin from Draftbox 18 | - SEO optimized 19 | - Fully responsive 20 | - Gatsby images 21 | - Styled 404 page 22 | - RSS Feed 23 | - AMP Pages 24 | - Sitemap 25 | - Contact Form 26 | - Subscribe Form 27 | - Social Sharing 28 | - Google Analytics Integration 29 | - Segment Integration 30 | - Disqus Integration 31 | - Composable and extensible 32 | 33 | ## Getting Started 34 | 35 | 1. Install this starter by running 36 | 37 | ```bash 38 | gatsby new wp-starter https://github.com/draftbox-co/gatsby-wordpress-balsa-starter 39 | ``` 40 | 41 | 2. Change directory 42 | 43 | ```bash 44 | cd wp-starter 45 | ``` 46 | 47 | 3. Run 48 | 49 | ```bash 50 | gatsby develop 51 | ``` 52 | 53 | and visit your site at `http://localhost:8000`. 54 | 55 | ## 🧐 What's inside? 56 | 57 | A quick look at the top-level files and directories you'll see in a Gatsby project. 58 | 59 | . 60 | ├── node_modules 61 | ├── static 62 | ├── .gitignore 63 | ├── gatsby-config.js 64 | ├── yarn.lock 65 | ├── package.json 66 | ├── siteConfig.js 67 | ├── .wordpress-config.json 68 | └── README.md 69 | 70 | 1. **`/node_modules`**: This directory contains all of the modules of code that your project depends on (npm packages) are automatically installed. 71 | 72 | 2. **`/static`**: This directory will contain all of the static files required by theme such as `favicon`, `logo` and `robot.txt`. 73 | 74 | 3. **`.gitignore`**: This file tells git which files it should not track / not maintain a version history for. 75 | 76 | 4. **`gatsby-config.js`**: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you’d like to include, etc. (Check out the [config docs](https://www.gatsbyjs.org/docs/gatsby-config/) for more detail). 77 | 78 | 5. **`yarn.lock`** (See `yarn.lock` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. **(You won’t change this file directly).** 79 | 80 | 6. **`siteConfig`**: A config file for your website, which includes things like website url, title, Background color, theme color etc. 81 | 82 | 7. **`.wordpress-config.json`**: A config file containing config required to fetch data from wordpress such as url and content keys etc. 83 | 84 | 8. **`README.md`**: A text file containing useful reference information about your project. 85 | 86 | ## Configure 87 | 88 | ```js 89 | //siteConfig.js 90 | module.exports = { 91 | siteUrl: "https://wp-balsa-preview.draftbox.co", // Site domain. Do not include a trailing slash! 92 | 93 | postsPerPage: 10, // Number of posts shown on paginated pages (changes this requires sometimes to delete the cache) 94 | 95 | siteTitleMeta: "Built with Draftbox", // This allows an alternative site title for meta data for pages. 96 | siteDescriptionMeta: "New-age blogging platform", // This allows an alternative site description for meta data for pages. 97 | 98 | shareImageWidth: 1000, // Change to the width of your default share image 99 | shareImageHeight: 523, // Change to the height of your default share image 100 | 101 | shortTitle: "Built with Draftbox", // Used for App manifest e.g. Mobile Home Screen 102 | siteIcon: "favicon.png", // Logo in /static dir used for SEO, RSS, and App manifest 103 | backgroundColor: "#e9e9e9", // Used for Offline Manifest 104 | themeColor: "#15171A", // Used for Offline Manifest 105 | apiUrl: "https://wordpress.theasdfghjkl.com", 106 | subscribeWidget: { 107 | title: "Subscribe to Draftbox", 108 | helpText: "Get the latest posts delivered right to your inbox.", 109 | successMessage: "Thanks for subscribing to Draftbox.", 110 | }, 111 | header: { 112 | navigation: [ 113 | { 114 | label: "Home", 115 | url: "https://wp-balsa-preview.draftbox.co/", 116 | }, 117 | { 118 | label: "Contact", 119 | url: "https://wp-balsa-preview.draftbox.co/contact", 120 | }, 121 | ], 122 | }, 123 | footer: { 124 | copyright: "Built with Draftbox", 125 | navigation: [ 126 | { 127 | label: "Home", 128 | url: "https://wp-balsa-preview.draftbox.co/", 129 | }, 130 | { 131 | label: "Sitemap", 132 | url: "https://wp-balsa-preview.draftbox.co/sitemap.xml", 133 | }, 134 | { 135 | label: "RSS", 136 | url: "https://wp-balsa-preview.draftbox.co/rss.xml", 137 | }, 138 | { 139 | label: "Contact", 140 | url: "https://wp-balsa-preview.draftbox.co/contact", 141 | }, 142 | { 143 | label: "External Link", 144 | url: "https://spectrum.chat/gatsby-js/themes?tab=posts", 145 | }, 146 | ], 147 | }, 148 | socialLinks: { 149 | twitter: "https://twitter.com/draftboxhq", 150 | facebook: "https://facebook.com/", 151 | instagram: "https://www.instagram.com/", 152 | linkedin: "https://linkedin.com/", 153 | github: "https://github.com/draftbox-co", 154 | }, 155 | contactWidget: { 156 | title: "Contact Built with Draftbox", 157 | successMessage: "We’ll get in touch with you soon.", 158 | }, 159 | }; 160 | ``` 161 | 162 | In the configuration shown above, the most important fields to be changed are `siteUrl`, `siteTitleMeta` and `siteDescriptionMeta`. Update at least those to fit your needs. 163 | 164 | ## WordPress Content configuration 165 | 166 | ```bash 167 | { 168 | "baseUrl": "yourwordpressblog.com", 169 | "protocol": "https", 170 | "hostingWPCOM": false, 171 | "useACF": true, 172 | "includedRoutes": [ 173 | "**/categories", 174 | "**/posts", 175 | "**/pages", 176 | "**/media", 177 | "**/tags", 178 | "**/taxonomies", 179 | "**/users" 180 | ] 181 | } 182 | ``` 183 | 184 | In the configuration shown above, the most important fields to be changed are `baseUrl` and `hostingWPCOM` . Update those with your configuration. example shown above works great for self hosted wordpress. 185 | 186 | If your blog is hosted on wordpress.com you will have to add few extra keys for reference check out [wordpress-source-docs](https://www.gatsbyjs.org/packages/gatsby-source-wordpress/). 187 | 188 | ## Deploy 189 | 190 | ```bash 191 | gatsby build 192 | ``` 193 | 194 | After completion of the build process your static site can be found in the `public/` folder. Copy those files over to your webserver. 195 | 196 | ## Authors 197 | 198 | - Arun Priyadarshi ([@Gunnerforlife](https://github.com/Gunnerforlife)) – [Draftbox](https://draftbox.co) 199 | - Keyur Raval ([@thandaanda](https://github.com/thandaanda)) – [Draftbox](https://draftbox.co) 200 | - Shyam Lohar ([@shyamlohar](https://github.com/shyamlohar)) – [Draftbox](https://draftbox.co) 201 | - Tanmay Desai ([@tanmaydesai89](https://github.com/tanmaydesai89)) – [Draftbox](https://draftbox.co) 202 | 203 | ## Contributions 204 | 205 | PRs are welcome! Consider contributing to this project if you are missing feature that is also useful for others. 206 | 207 | # Copyright & License 208 | 209 | Copyright (c) 2020 [Draftbox](https://draftbox.co) - Released under the [MIT license](LICENSE). 210 | -------------------------------------------------------------------------------- /gatsby-config.js: -------------------------------------------------------------------------------- 1 | // loading env 2 | const activeEnv = process.env.NODE_ENV || 'development' 3 | console.log(`Using environment config: '${activeEnv}'`) 4 | require("dotenv").config({ 5 | path: `.env.${activeEnv}`, 6 | }) 7 | 8 | let siteConfig; 9 | let wordpressConfig; 10 | 11 | try { 12 | siteConfig = require(`./siteConfig`); 13 | wordpressConfig = require(`./.wordpress-config`); 14 | } catch (e) { 15 | console.log(e); 16 | } 17 | 18 | console.log(typeof process.env.WP_HOSTING_WPCOM); 19 | const hostingWPCOM = process.env.WP_HOSTING_WPCOM && process.env.WP_HOSTING_WPCOM === "true" ? true: false; 20 | if (process.env.WP_BASE_URL) { 21 | wordpressConfig.baseUrl = process.env.WP_BASE_URL; 22 | wordpressConfig.protocol = process.env.WP_PROTOCOL ? process.env.WP_PROTOCOL : "https"; 23 | if (hostingWPCOM) { 24 | wordpressConfig.hostingWPCOM = true; 25 | wordpressConfig.auth = {}; 26 | wordpressConfig.auth.wpcom_app_clientSecret = process.env.WP_CLI_SEC; 27 | wordpressConfig.auth.wpcom_app_clientId = process.env.WP_CLI_ID; 28 | wordpressConfig.auth.wpcom_user = process.env.WP_USER; 29 | wordpressConfig.auth.wpcom_pass = process.env.WP_PASS; 30 | wordpressConfig.includedRoutes.push("**/settings"); 31 | } 32 | } 33 | 34 | console.log(wordpressConfig); 35 | 36 | let gatsbyPlugins = [ 37 | { 38 | resolve: `@draftbox-co/gatsby-wordpress-balsa-theme`, 39 | options: { 40 | wordpressConfig, 41 | siteConfig: siteConfig, 42 | }, 43 | }, 44 | ]; 45 | 46 | if (process.env.SEGMENT_KEY) { 47 | gatsbyPlugins.push({ 48 | resolve: `gatsby-plugin-segment-js`, 49 | options: { 50 | prodKey: process.env.SEGMENT_KEY, 51 | devKey: process.env.SEGMENT_KEY, 52 | trackPage: true, 53 | delayLoad: true, 54 | delayLoadTime: 1000, 55 | }, 56 | }); 57 | } 58 | 59 | if (process.env.GA) { 60 | gatsbyPlugins.unshift({ 61 | resolve: `gatsby-plugin-google-analytics`, 62 | options: { 63 | trackingId: process.env.GA, 64 | head: true, 65 | }, 66 | }); 67 | } 68 | 69 | if (process.env.GATSBY_MIXPANEL_TOKEN) { 70 | gatsbyPlugins.push({ 71 | resolve: `gatsby-plugin-mixpanel`, 72 | options: { 73 | apiToken: process.env.GATSBY_MIXPANEL_TOKEN, 74 | enableOnDevMode: true, 75 | pageViews: 'all' 76 | }, 77 | }); 78 | } 79 | 80 | if (process.env.GATSBY_HOTJAR_ID) { 81 | gatsbyPlugins.push({ 82 | resolve: `@draftbox-co/gatsby-plugin-hotjar-lazy`, 83 | options: { 84 | id: process.env.GATSBY_HOTJAR_ID, 85 | sv: 6, 86 | optimize: true, 87 | } 88 | }); 89 | } 90 | 91 | if (process.env.GATSBY_GTAG_MANAGER_ID) { 92 | gatsbyPlugins.unshift({ 93 | resolve: `gatsby-plugin-google-tagmanager`, 94 | options: { 95 | id: process.env.GATSBY_GTAG_MANAGER_ID, 96 | includeInDevelopment: true 97 | }, 98 | }); 99 | } 100 | 101 | if (process.env.GATSBY_TAWK_ID) { 102 | gatsbyPlugins.push({ 103 | resolve: `@draftbox-co/gatsby-plugin-tawk-lazy`, 104 | options: { 105 | tawkId: process.env.GATSBY_TAWK_ID, 106 | optimize: true, 107 | } 108 | }); 109 | } 110 | 111 | if (process.env.GATSBY_CRISP_ID) { 112 | gatsbyPlugins.push({ 113 | resolve: `@draftbox-co/gatsby-plugin-crisp-chat-lazy`, 114 | options: { 115 | websiteId: process.env.GATSBY_CRISP_ID, 116 | enableDuringDevelop: true, 117 | optimize: true, 118 | } 119 | }); 120 | } 121 | 122 | if (process.env.GATSBY_OLARK_ID) { 123 | gatsbyPlugins.push({ 124 | resolve: `@draftbox-co/gatsby-plugin-olark-lazy`, 125 | options: { 126 | olarkSiteID: process.env.GATSBY_OLARK_ID, 127 | optimize: true, 128 | } 129 | }); 130 | } 131 | 132 | module.exports = { 133 | plugins: gatsbyPlugins, 134 | }; 135 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "gatsby-wordpress-balsa-starter", 3 | "description": "A Gatsby starter for creating blogs from headless WordPress CMS.", 4 | "version": "1.0.0", 5 | "main": "index.js", 6 | "license": "MIT", 7 | "scripts": { 8 | "develop": "gatsby develop", 9 | "build": "gatsby build", 10 | "clean": "gatsby clean" 11 | }, 12 | "devDependencies": { 13 | "gatsby": "2.20.24", 14 | "react": "^16.13.0", 15 | "react-dom": "^16.13.0" 16 | }, 17 | "dependencies": { 18 | "@draftbox-co/gatsby-wordpress-balsa-theme": "^1.0.40", 19 | "@draftbox-co/gatsby-plugin-crisp-chat-lazy": "^0.0.3", 20 | "@draftbox-co/gatsby-plugin-hotjar-lazy": "^0.0.1", 21 | "@draftbox-co/gatsby-plugin-olark-lazy": "^0.0.1", 22 | "@draftbox-co/gatsby-plugin-tawk-lazy": "^0.0.1", 23 | "dotenv": "^8.2.0", 24 | "gatsby": "2.20.24", 25 | "gatsby-plugin-disqus": "^1.1.4", 26 | "gatsby-plugin-google-analytics": "^2.2.2", 27 | "gatsby-plugin-google-tagmanager": "^2.3.5", 28 | "gatsby-plugin-mailchimp": "^5.1.2", 29 | "gatsby-plugin-mixpanel": "^3.1.6", 30 | "gatsby-plugin-segment-js": "^3.1.0", 31 | "react": "^16.13.0", 32 | "react-dom": "^16.13.0", 33 | "react-facebook": "^8.1.4" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /siteConfig.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | siteUrl: "https://wp-balsa-preview.draftbox.co", // Site domain. Do not include a trailing slash! 3 | 4 | postsPerPage: 10, // Number of posts shown on paginated pages (changes this requires sometimes to delete the cache) 5 | 6 | siteTitleMeta: "Built with Draftbox", // This allows an alternative site title for meta data for pages. 7 | siteDescriptionMeta: 8 | "Lightning fast, secure front-end for your WordPress or Ghost blog, without coding", // This allows an alternative site description for meta data for pages. 9 | 10 | shareImageWidth: 1000, // Change to the width of your default share image 11 | shareImageHeight: 523, // Change to the height of your default share image 12 | 13 | shortTitle: "Built with Draftbox", // Used for App manifest e.g. Mobile Home Screen 14 | siteIcon: "favicon.png", // Logo in /static dir used for SEO, RSS, and App manifest 15 | backgroundColor: "#e9e9e9", // Used for Offline Manifest 16 | themeColor: "#15171A", // Used for Offline Manifest 17 | apiUrl: "https://wordpress.theasdfghjkl.com", 18 | subscribeWidget: { 19 | visible: true, 20 | title: "Subscribe to Draftbox", 21 | helpText: "Get the latest posts delivered right to your inbox.", 22 | successMessage: "Thanks for subscribing to Draftbox.", 23 | }, 24 | header: { 25 | navigation: [ 26 | { 27 | label: "Home", 28 | url: "https://wp-balsa-preview.draftbox.co/", 29 | }, 30 | { 31 | label: "Contact", 32 | url: "https://wp-balsa-preview.draftbox.co/contact", 33 | }, 34 | ], 35 | }, 36 | footer: { 37 | copyright: "Built with Draftbox", 38 | navigation: [ 39 | { 40 | label: "Home", 41 | url: "https://wp-balsa-preview.draftbox.co/", 42 | }, 43 | { 44 | label: "Sitemap", 45 | url: "https://wp-balsa-preview.draftbox.co/sitemap.xml", 46 | }, 47 | { 48 | label: "RSS", 49 | url: "https://wp-balsa-preview.draftbox.co/rss.xml", 50 | }, 51 | { 52 | label: "Contact", 53 | url: "https://wp-balsa-preview.draftbox.co/contact", 54 | }, 55 | { 56 | label: "External Link", 57 | url: "https://spectrum.chat/gatsby-js/themes?tab=posts", 58 | }, 59 | ], 60 | }, 61 | socialLinks: { 62 | twitter: "https://twitter.com/draftboxhq", 63 | facebook: "https://facebook.com/", 64 | instagram: "https://www.instagram.com/", 65 | linkedin: "https://linkedin.com/", 66 | github: "https://github.com/draftbox-co", 67 | pinterest: "", 68 | youtube: "", 69 | dribbble: "", 70 | behance: "", 71 | externalLink: "", 72 | whatsapp: "", 73 | }, 74 | contactWidget: { 75 | title: "Contact Built with Draftbox", 76 | successMessage: "We’ll get in touch with you soon.", 77 | }, 78 | metadata: { 79 | title: "Built with Draftbox", 80 | description: 81 | "Lightning fast, secure front-end for your WordPress or Ghost blog, without coding. Draftbox is a new-age blogging platform for everyone, built on Gatsby.", 82 | }, 83 | twitterCard: { 84 | title: "Built with Draftbox", 85 | description: 86 | "Lightning fast, secure front-end for your WordPress or Ghost blog, without coding. Draftbox is a new-age blogging platform for everyone, built on Gatsby.", 87 | imageUrl: "twitterImage.png", 88 | username: "@DraftboxHQ", 89 | }, 90 | facebookCard: { 91 | title: "Built with Draftbox", 92 | description: 93 | "Lightning fast, secure front-end for your WordPress or Ghost blog, without coding. Draftbox is a new-age blogging platform for everyone, built on Gatsby.", 94 | imageUrl: "facebookImage.png", 95 | appId: "2391725224459953", 96 | }, 97 | siteTitle: "Built with Draftbox", 98 | siteDescription: 99 | "Lightning fast, secure front-end for your WordPress or Ghost blog, without coding.", 100 | language: "en", 101 | logoUrl: "logo.png", 102 | iconUrl: "favicon.png", 103 | coverUrl: "cover.jpg", 104 | alternateLogoUrl: "logo.png", 105 | themeConfig: { 106 | variables: [ 107 | { 108 | varName: "--primary-color", 109 | value: `#2b6cb0`, 110 | }, 111 | { 112 | varName: "--primary-color-active", 113 | value: `#2a4365`, 114 | }, 115 | { 116 | varName: "--primary-color-light", 117 | value: `#bee3f8`, 118 | }, 119 | { 120 | varName: "--sans-font", 121 | value: `"Montserrat"`, 122 | }, 123 | { 124 | varName: "--sans-font-normal", 125 | value: `400`, 126 | }, 127 | { 128 | varName: "--sans-font-medium", 129 | value: `500`, 130 | }, 131 | { 132 | varName: "--sans-font-semibold", 133 | value: `600`, 134 | }, 135 | { 136 | varName: "--sans-font-bold", 137 | value: `700`, 138 | }, 139 | { 140 | varName: "--serif-font", 141 | value: `Merriweather`, 142 | }, 143 | { varName: "--serif-font-light", value: `300` }, 144 | { varName: "--serif-font-normal", value: `400` }, 145 | { varName: "--serif-font-medium", value: `400` }, 146 | { varName: "--serif-font-bold", value: `700` }, 147 | ], 148 | fonts: [ 149 | { 150 | family: "Montserrat", 151 | variants: ["400", "500", "600", "700"], 152 | //subsets: ['latin'] 153 | //text: 'Hello' 154 | fontDisplay: "swap", 155 | strategy: "selfHosted", // 'base64' || 'cdn' 156 | }, 157 | { 158 | family: "Merriweather", 159 | variants: ["300", "400", "700"], 160 | //subsets: ['latin'] 161 | //text: 'Hello' 162 | fontDisplay: "swap", 163 | strategy: "selfHosted", // 'base64' || 'cdn' 164 | }, 165 | ], 166 | }, 167 | }; 168 | -------------------------------------------------------------------------------- /src/@draftbox-co/gatsby-wordpress-balsa-theme/components/disqus.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { DiscussionEmbed } from "disqus-react"; 3 | 4 | const Disqus = props => { 5 | const disqusConfig = { 6 | shortname: process.env.GATSBY_DISQUS_SHORTNAME, 7 | identifier: props.slug, 8 | title: props.slug 9 | }; 10 | 11 | return process.env.GATSBY_DISQUS_SHORTNAME ? ( 12 | 13 | ) : ( 14 | <> 15 | ); 16 | }; 17 | 18 | export default Disqus; 19 | -------------------------------------------------------------------------------- /src/@draftbox-co/gatsby-wordpress-balsa-theme/components/fb-comments.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { FacebookProvider, Comments } from 'react-facebook'; 3 | 4 | const FbComments = props => { 5 | return process.env.GATSBY_FB_APP_ID ? ( 6 | 7 | 8 | 9 | ) : ( 10 | <> 11 | ); 12 | }; 13 | 14 | export default FbComments; 15 | -------------------------------------------------------------------------------- /starters.yaml: -------------------------------------------------------------------------------- 1 | - url: https://wp-balsa-preview.draftbox.co 2 | repo: https://github.com/draftbox-co/gatsby-wordpress-balsa-starter 3 | description: A Gatsby starter for creating blogs from headless WordPress CMS. 4 | tags: 5 | - AMP 6 | - Blog 7 | - CMS:Headless 8 | - CMS:WordPress 9 | - Disqus 10 | - Language:TypeScript 11 | - Netlify 12 | - Pagination 13 | - PWA 14 | - RSS 15 | - SEO 16 | - Styling:Tailwind 17 | features: 18 | - Balsa Skin by Draftbox 19 | - Data sourcing from headless WordPress 20 | - Responsive design 21 | - SEO optimized 22 | - OpenGraph structured data 23 | - Twitter Cards meta 24 | - Sitemap Generation 25 | - XML Sitemaps 26 | - Progressive Web App 27 | -------------------------------------------------------------------------------- /static/cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/cover.jpg -------------------------------------------------------------------------------- /static/cover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/cover.png -------------------------------------------------------------------------------- /static/cover_1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/cover_1.png -------------------------------------------------------------------------------- /static/facebookImage.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/facebookImage.jpg -------------------------------------------------------------------------------- /static/facebookImage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/facebookImage.png -------------------------------------------------------------------------------- /static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/favicon.ico -------------------------------------------------------------------------------- /static/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/favicon.png -------------------------------------------------------------------------------- /static/favicon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/favicon1.png -------------------------------------------------------------------------------- /static/favicon_1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/favicon_1.png -------------------------------------------------------------------------------- /static/images/logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /static/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/logo.png -------------------------------------------------------------------------------- /static/robots.txt: -------------------------------------------------------------------------------- 1 | User-agent: * 2 | Allow: / 3 | -------------------------------------------------------------------------------- /static/static/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/static/favicon.png -------------------------------------------------------------------------------- /static/twitterImage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/draftbox-co/gatsby-wordpress-balsa-starter/87737243bb48eaeaa3879add74433913e8e3d406/static/twitterImage.png --------------------------------------------------------------------------------