How could I make a blog function with Bootstrap Studio?

I am a newbie of website developer. I created a website by myself. I almost finished the page design. I am going to deploy the website on the WordPress platform. I didn’t use any WordPress template for my design website, but I used BSS to design, my website has a blog page, I want to show a list of articles, and then you can show the head position of the recent articles, but I want to do to achieve, after I want to store blog articles on the server, When I click on these articles to browse, how do I call these articles, unlike the smart form component, which can fill in an Email address, please ask senior engineers, what should I do next? Do I need to learn PHP on the back end? Or can I use plugins in WordPress to integrate my site with WordPress to implement the blogging features I mentioned? Please give me a good suggestion, thanks a lot.

Bootstrap Studio is used to build “front end” websites using HTML, JavaScript and CSS. It cannot be “deployed on the WordPress platform.”

WordPress uses a combination of a server-side ('bank-end") language (PHP) and mySQL databases to handle things like blogging, CMS, user accounts, and so on.

While technically the “front end” of a WordPress website can be created using Bootstrap (or many other frameworks or technologies,) this requires custom page templating, installing Bootstrap itself into WordPress, and doing a lot of manual coding.

I don’t believe there is any easy way to take a website generated by Bootstrap Studio and use it as the front-end of a WordPress website. Most people who build their websites with BSS, and who also want a WordPress blog, will install Wordpress into a subfolder on their server, and then add appropriate navigation links on both the BSS and Wordpress sites. Then they style the Wordpress theme to look similar to their BSS website.

There have been a few discussion here in the forum on ways to add blogging to BSS via both WordPress and third-party applications. A few people have posted some different applications they’ve used besides WordPress. Here are a couple of links. You can search the forums for more.

1 Like

Some questions to ask you…

How many blog posts are you intending to publish a day/week?

Will it just be you that is publishing the posts, or will it be other users too?

Will you want to publish from anywhere or just your device that has bootstrap studio installed?


If it is just you that is publishing a few posts a week from your bootstrap studio device then there you could do the whole thing in bootstrap. You could have a blog/index.html page with some cards giving you the articles with title, summary and main image with a link to the blog post

1 Like

There is a blog template in BSS
Here is an example

2 Likes

If you are going to post the “blog” content yourself, and you’re not concerned with the posts being saved in a database (i.e. searchable, sortable, filterable, etc.) you can just create a page and add the posts in an article style format. Here’s an example of one I created for a client who posts maybe 2 or 3 times a year.

1 Like

@twinstream

I was using a table on a admin page to make the search data and save it as a json file. I didn’t include the link on the page because I saved the json file on the server without any serializing of the json file. Now the example doesn’t use the admin page longer so here is a the link to the admin page.

You can create, read, update or delete posts for the search data.

Let me know if you are interested of the .bsdesign file then I send you the file

With Google Sheet Apps Script, you can easily create a live endpoint if you want to pull data from a spreadsheet
here is a how to video

3 Likes

Thanks a lot first, I will read the discussion later, it’s helpful to me – a newbie on website building. BSS is a convenient tool for designing pages. I need to improve my skills. I have been thinking and learning how to create some new WordPress themes, I think it should be the only way to combine the design of website with BSS and functions of WordPress. Anyway, thanks for your detailed answer.

I’m doing a promotional website for a club, exactly. I’m not sure about the number of blog posts, but I’m sure the content creator is very good at writing. I have thought about your suggestion to create some static pages with more links, but I don’t think that can achieve some functions, such as showing a small part of the most recently updated blogs on the home page and then clicking read more to jump to the next page. There is also a feature in the blog page that has a sidebar to display a list of blogs by date. I think it can only be done with background functions. I’m a beginner, a novice, so I’m not sure if I’m thinking in the right direction, so I came to the forum to ask you. BSS is a good tool, I also considered using Elementor or similar tools, but I think similar tools do not have a high degree of freedom, and I like to operate on my computer, and do not like all the writing or design to be completed online, which is why I choose BSS. I also chose BSS because it can do responsive web design. The website I am working on now does not need the member registration function, and I have considered many other functions, so I want to combine the front-end development function of BootStrap with the WordPress platform to complete this website.

Wow, it’s really a good reference example. The design of blog function is really good. Yeah, maybey this design is good. But I still need to think about how to achieve more complicated blog functions and add other functions. Thank you so much!!!

I will try this layout and the page design for blog, but the customer may not like this design, maybe I can convince him, but I will think about more solutions, thank you very much for your reply.

@Ginkgoandenoak

You can use the same approach on any type of layout. I use the clean blog because it is a simple layout to show the logic of the folder structure, page numbering and a simple search function. You can easily add more pages like categories, tags, recent posts and archives with the same folder structure. You can use it with Bootstrap Studio’s linked components and display, for example, the categories and tags of each blog post in a sidebar.

Printninja’s approach is for a blog with not many posts, if the blog grows and you have 100 posts, you need to add 100 modals and 100 cards to the page which will make a page with many elements and slow down the page load. If he had data attributes on each card, only one modal would have been needed to show the related Target data attributes in the modal

2 Likes

I got it, I will reference your advice and his adivce according conditions. I am reading other articles that all of guys replied.

Due to the urgency of my small project, I want to have a higher efficiency. Just now, I tried to use the Theme Converter of Pinegrow for WordPress. Due to the large size of the exported webpage file from BSS, an error was reported that the theme could not be generated.

The error:
The source folder xxxxxxxxxx has more than 150 MB of data in more than 500 files. All these files would be copied to the theme export folder. That’s probably not what you want, so we’ll abort the export.

Did you place your HTML file on the top level of Documents, Desktop or a similar folder with lots of files (for example, Documents/index.html)? Theme source files (HTML files and resources) should be enclosed in a folder (for example, Documents/MyTheme/index.html).

I read the product evaluation you wrote https://forum.bootstrapstudio.io/t/bootstrap-studio-vs-pinegrow-or-webflow/5207/11?u=ginkgoandenoak and their tutorial video https://www.youtube.com/watch?v=2HqK5F9VONU, then I found that the configuration and use are not as easy as BSS, or similar. Maybe I need to be familiar with their operation methods, but I don’t think it is easy. I thought I could directly generate a WordPress theme with one click or easily deploy steps, but it doesn’t seem like this. It’s not easy. I might need to rethink another approach. My website is over 50 pages with so many articles, I feel like there is a big mountain in front of me… :sweat_smile: :smiling_face_with_tear:

In addition, if the task of this website is urgent, or the other side reduces the demand, maybe I can use the case you gave to complete the construction of blog pages and the deployment of static websites.

If you have the WordPress version of Pinegrow, I would say it would make more sense to just build your entire website in Pinegrow, rather than import a site built in Bootstrap Studio. Pinegrow fully supports the latest version of Bootstrap. The UI is not as elegant as Bootstrap Studio, but the program can pretty much do everything Bootstrap Studio does (and a few things BSS doesn’t do!)

Got it, your soonest response will be highly appreciated. :+1: :+1:

My soonest response? I have nothing else to offer.

Sorry,English is not my mother tongue, I should say thanks for your timely reply. :+1:

i did several time, managing plain html created from BSS to blogging; mostly i use strapi, but sometimes just need to use google sheet, or just directly using markdown file. Feel free ping me in person of you wanna know more, i’ll happy to share :")

f you want a static blog I recommend Astro as framework. It works nicely with Bootstrap Studio.
You copy your pre made components from Bootstrap Studio and paste them into Astro as components.

Then you can place the componets on any page in your Astro project. Run the build script and deploy the dist folder anywhere. It took my around two hours to copy and paste my componets into Astro and place them where I wanted them to be.

Here is the example site

2 Likes

I don’t trust that guy Walter White. I’ve heard bad things about him.

2 Likes