# Convert Webflow to Bootstrap in Pinegrow?

**URL:** <https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090>\
**Category:** Bootstrap\
**Created:** [June 11, 2019, 12:08pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090 "2019-06-11T12:08:36Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 11, 2019, 12:08pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/1 "2019-06-11T12:08:36Z")

</div>

Has anyone converted a Webflow site to Bootstrap 4? I have about 6 sites I would really like to get over to Bootstrap. We need a Pinegrow tutorial for this as it should not be that hard as the classes are close in naming convention. Anyone successfully done this?

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 11, 2019, 7:12pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/2 "2019-06-11T19:12:18Z")

</div>

As far as I know, Webflow uses CSS Grid while Bootstrap uses Flexbox.

---

<div class="post-metadata">

**Author:** ![dcneuts](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/dcneuts/32/1173_2.png) [@dcneuts](https://forum.pinegrow.com/u/dcneuts)\
**Post date:** [June 13, 2019, 6:20pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/3 "2019-06-13T18:20:53Z")

</div>

Absolutely correct. These are two different animals, I’m seeing a lot of Webflow chatter lately. Any modifications will have to be made by code, manually. Good luck!

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 13, 2019, 11:40pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/4 "2019-06-13T23:40:03Z")

</div>

HI, that’s interesting, I didn’t realise that, Had no real reason to as I have had nothing to do with Webflow, but what is the _chatter_ that is going on?  
Is there a migration or such like going on… change it the air etc?  
New favourite kid/ trend on the block?

---

<div class="post-metadata">

**Author:** ![dcneuts](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/dcneuts/32/1173_2.png) [@dcneuts](https://forum.pinegrow.com/u/dcneuts)\
**Post date:** [June 14, 2019, 12:02am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/5 "2019-06-14T00:02:30Z")

</div>

Apparently there are numerous PG users that are coding projects in Webflow. That’s a proprietary system that also wants you to host with them (preferably) as well. I’ve played with it in the past so I could understand what it was, but since it’s a “visual builder” it’s using it’s own methods of outputting what they consider to be clean code. Since the converter was released for PG, they are asking for it to be supported. I’m not sure how that’s going to happen cleanly, they still need to hand-code the conversion if they want to install a front-end framework. There’s no getting around the need to code. PG is more to augment coders, not augment visual builders, even with applications like Wappler (which would be preferred) there’s still coding involved. Not advocating the “long way around” but really advocating the right tool in the right context. It would be like building something using Wix and expecting a third-party to turn it into usable, real code. Sure, it’ll probably export, but with it’s own structure. There’s only so much PG devs can do, and they’re catering to a different audience than this. Feels like a disconnect.

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 14, 2019, 12:08am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/6 "2019-06-14T00:08:45Z")

</div>

Why would anyone spend money monthly to work in Webflow if they already own Pinegrow? To use Webflow, you need an internet connection, and you have to purchase an account. Quit paying, and you lose all access to edit your site (with their builder, you can always export the code and hand edit I guess.)

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 12:16am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/7 "2019-06-14T00:16:29Z")

</div>

Webflow is expensive. I built 15 sites with it but the CMS was feature weak. I also did not want to always need to host with them. One client it seems like a deal at $16//mo. But 100 clients at $1600/mo is crazy. I have a cPanel server for $300/mo with 100 sites.

PH is a breath of fresh air. I like quick visual building, but being able to touch the code is key.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 14, 2019, 12:16am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/8 "2019-06-14T00:16:38Z")

</div>

ok thanks. Interesting.  
I’ve just purchased the Theme builder now to support the PG team as I’ve been running quite a long time on my current PG product now 🙂 cheers @Devs 🙂

Well, it does list WebFlow as one of the editors for using with the WP theme builder,  
So this will be interesting, seeing as BS and WF use different layout technologies.

But it’s 1am and IM tired, so it might make perfectly logical sense the next time I log in 😉  
And as @Printninja notes, using PG and Webflow seems like an expensive way to go about it, but maybe Weblow has a certain mojo and beauty in the way it creates the website… maybe until you get to the bit where you need to use PG or modify it, then maybe the scrambled code beast underneath raises its head - or the different layout technologies make things awkward.  
Interesting and good to know!  
Cheers

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 14, 2019, 12:23am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/9 "2019-06-14T00:23:50Z")

</div>

Ouch! yes, that isn’t cheap.

mmm, maybe use the PG CSS grid builder then?  
If Webflow uses CSS grid for implementing its layout,  
And PG uses CSS Grid builder… to create CSS grids,  
Maybe go along that route?

Native technologies, (ie, CSS Grid) will always outdo 3rd party Auxiliary ones like Bootstrap.  
Lovely and shiny until they do something like move from BS 3 to BS 4 - loss of _Cards_ etc  
and there goes the ability to just upgrade your site without some digging around.

You are then dependent upon one core technology and  
Another random one, driven by different devs, with a different remit, than those that just develop for  
**the web**

But either way, good luck with it 🙂 good to know how things are moving around, bobbing about on the _web tide_ out there.  
Thanks for info all 🙂

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 12:31am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/10 "2019-06-14T00:31:35Z")

</div>

I am trying to use PG framework free with core Html and CSS functions. That seems best. I don’t want to rely on frameworks and proprietary formats moving forward. I want to see PG grow with modern web standards, not so much Bootstrap and Foundation. Flexbox and CSS Grid are great in PG I believe. Just keep PG standards complaints and it will be amazing.

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 12:34am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/11 "2019-06-14T00:34:26Z")

</div>

I agree. Let’s focus PG and plain old  
HTML and CSS native functions and make  
It best it can be. Keep Bootstrap support as it is the biggest.

I do like Bootstrap when I need Accessibility features as it is tried and true already.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [June 14, 2019, 12:36am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/12 "2019-06-14T00:36:34Z")

</div>

> [@bgarrant](#):
>
> I do like Bootstrap when I need Accessibility features

Ah yes! good point!  
And for all that responsive goodness of course.

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 12:46am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/13 "2019-06-14T00:46:16Z")

</div>

Is there a way to just turn on the components we want in Bootstrap SCSS in PG? Seems it is all or nothing.

Personally I may just use Bootstrap Grid, Navbar, Buttons, Cards and Forms. The rest I don’t need. I really like the BS Grid as CSS Grid lacks full browser support.

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 12:59am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/14 "2019-06-14T00:59:34Z")

</div>

Can you do this in Pinegrow or will it mess it up?

```auto
// Custom.scss
// Option B: Include parts of Bootstrap

// Required
@import "../node_modules/bootstrap/scss/functions";
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/mixins";

// Optional
@import "../node_modules/bootstrap/scss/reboot";
@import "../node_modules/bootstrap/scss/type";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/code";
@import "../node_modules/bootstrap/scss/grid";

```

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 14, 2019, 2:42am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/15 "2019-06-14T02:42:14Z")

</div>

@bgarrant Are you on a dedicated server? I only pay about $200 a year for a shared cPanel server with about 70 sites on it. Never have a problem.

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 14, 2019, 2:46am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/16 "2019-06-14T02:46:19Z")

</div>

I believe you can download a customized version of Bootstrap directly from the Bootstrap site, and then just import the stuff into PG.

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 5:07am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/17 "2019-06-14T05:07:36Z")

</div>

@Printninja What company did you get that from? I may look to switch.

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 9:31am UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/18 "2019-06-14T09:31:37Z")

</div>

I would love to know how to get cPanel server for $200. Please share when you get a chance. Thanks.

---

<div class="post-metadata">

**Author:** ![Printninja](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/printninja/32/1181_2.png) [@Printninja](https://forum.pinegrow.com/u/Printninja)\
**Post date:** [June 14, 2019, 3:52pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/19 "2019-06-14T15:52:01Z")

</div>

I have the Business plan  
[https://www.hostgator.com/web-hosting1](https://www.hostgator.com/web-hosting1)

---

<div class="post-metadata">

**Author:** ![bgarrant](https://avatars.discourse-cdn.com/v4/letter/b/bc79bd/32.png) [@bgarrant](https://forum.pinegrow.com/u/bgarrant)\
**Post date:** [June 14, 2019, 6:42pm UTC](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090/20 "2019-06-14T18:42:44Z")

</div>

That is great. I have a cloud enterprise server at [Hosting.com](http://Hosting.com). It is fully managed with firewall and backups for about $400. Expensive for sure

[Next page](https://forum.pinegrow.com/t/convert-webflow-to-bootstrap-in-pinegrow/3090.md?page=2)
