How to edit the framework?

I’ve not used bootstrap since about 2013 but I always understood a framework being something to edit and build with, am I wrong?

It’s a bit confusing that the product implies being able to do so but is creating inline styles by default rather than in a site specific bootstrap.css file.

I get making new styles but the product name implies working directly on the framework, am I thinking wrongly or attempting something unorthodox?

You should probably go through the Docs (link on top menu) and familiarize yourself with the app as there’s ways to alter that setting so that you can do the CSS instead of inline. Best to go through those as that will speed up your use of the app and our need to answer already documented questions :stuck_out_tongue: No offense meant, just saying it’s all there already :slight_smile:

2 Likes

Am I wrong in thinking for years that bootstrap and all other frameworks are scaffolding to build with, digital tools? Like useful stuff as I understood Bootstrap to be is that it is/was? a framework to use and repurpose and change? Am I wrong?

A "frame"work helps you “frame” out a website. That doesn’t mean it will have everything necessary to produce the exact finished product you want. That’s why there is an Appearance panel, and an Options panel.

All the settings applied via the Options panel add Bootstrap utility classes to the various components. The adjustments you make via the Appearance panel give you access to CSS that is not part of the Bootstrap framework. These CSS added via the Appearance panel is inline, but can be extracted to external stylesheets. This is explained in the docs.

You can also add utility classes directly by typing their name in the Class Names field of the Attributes panel. Lastly, you can create CSS directly via the internal editor (or a linked external editor.)

Bootstrap Studio allows you to easily build a website VISUALLY using the Bootstrap framework, and while it is possible to do a lot with just the visual UI and drag-and-drop components, if you want a customized website that looks significantly different in appearance from a stock Bootstrap website, you will often need to use custom CSS.

And the program offers FAR more than just the ability to build a website with the Bootstrap framework.

1 Like

Yes, but the product name implies working directly in a studio environment on Bootstrap, I’ve not used it for years so I’m a bit confused why I can’t do so as default.

I just think its a shame how insecure copy paste website ‘developers’ have held back everyone else who just want to make stuff. Imagine if the same chodes were trying to build any other creative application? We’d have no photoshop, no Quark, InDesign, no Capture One, no Maya. They’d all be subscription only and abstracted to use npm merde that makes those same chodes feel like a priesthood.

Really not sure what you’re complaint is, or what you’re ranting about.

Bootstrap Studio has a browser demo so you can try it before you buy. If you try it and don’t like it, then why buy it?

The Bootstrap Studio home page explains very clearly and honestly what the program does, and what you get.

For a one-time charge of $59 (which is ridiculously cheap), you get software with lifetime updates, 16 built-in templates, free web hosting, e-commerce abilities, smart forms, animation features, a lightbox gallery, Google’s webfonts, a huge online library of user-made components, numerous icon libraries like FontAwesome, built-in CSS, SASS and JS editing, you can import existing websites and connect external software like Photoshop, Illustrator, Visual Studio and others.

The Bootstrap developers are incredibly responsive to user requests and suggestions, and I’ve seen at least a dozen ideas I had suggested get incorporated into the program over the years. This sort of interaction with users is practically UNHEARD OF these days. They fix bugs faster than any other software company I’ve ever seen, and they are constantly updating and improving the program.

I’ve been using computers since the late 1970’s, making my living with computers for the past 25 years, and specifically with this software for the past five years. I consider it BY FAR the best piece of software I’ve ever purchased. It’s paid itself back to me more than a 1000 times over.

You stated that you, “haven’t used it in years.” So not being familiar with the current incarnation, your first act is to come here to the forum and bash it?

Maybe you simply need to take the time to read the documentation, watch the videos, and learn how to use the program? There are many hundreds of people in this forum using BSS every day to build websites, and we’re all quite happy with it.

(BTW - Adobe software is subscription only.)

4 Likes

I purchased the application thinking it was a bootstrap framework editor. I’m not happy as it appears to be abstracted, all I asked was why it is creating inline styles rather than in bootstrap.css. Basic stuff.

And I gave you the answer that you needed in order to use the software correctly. You can’t expect us to regurgitate everything that has already been laid out clearly in the Docs. If you just can’t find whatever it is you need to go read them, that’s on you.

This is a Bootstrap builder. You can do a whole lot with it, but it’s not something you will sit down and just start editing. There is a lot of drag and drop in it as well as already built components that Bootstrap uses.

Just do the footwork and go read the Docs. I promise, your money is not wasted on this app. Many of us have already been using it for quite a few years. Give it a chance and you’ll see. Read the docs and if that still doesn’t explain how it works please do come and let us know and one of us users will help you out.

Let’s not make this a bashing thread please, not necessary.

1 Like

Am I wrong, and was I wrong to understand bootstrap as a framework to adapt, edit and design? Please do correct me if I’m wrong? That is how I’ve understood HTML5 from the outset, that’s the benefit of bootstrap? I’m just asking why styles are applied inline rather than on corresponding classes as defined in the framework and why if the user changes anything it is applied inline as default? Surely it is better to change the framework, that is the point of one?

Frameworks were created to minimize the need to manually edit code when building a website. Not eliminate it. Before Bootstrap Studio, if you wanted to build a website with Bootstrap, you had to use a text editor and manually type out the HTML and CSS.

Bootstrap has come a LONG way in the last ten years, and Bootstrap Studio has become massively more powerful over the last five years. If you want, you can build a fully functional Bootstrap-based website using Bootstrap Studio without ever having to type a single line of code. Bootstrap Studio allows you to apply any of the many dozens of Bootstrap utility classes to dozens of premade HTML components through a visual user interface. That is its main function, and it does this very well.

But if you want to customize your website’s appearance so that elements look significantly different from the stock Bootstrap component’s look and feel, and you are unable to do this using Bootstrap utility classes, then you will often have to customize the CSS that is applied to these components. The program gives you a visual means do this as well through the Appearance panel. While the adjustments made via the Appearance panel are initially added as inline CSS rules, all you have to do is click the three vertical dots next to the rule in the Style panel and you can extract the inline CSS to an external stylesheet.

If your main complaint is that the program adds inline CSS, this complaint is addressed by reading the docs, watching the tutorial videos, or even searching the forum (as the subject has been discussed numerous times.)

If you take the time to watch some of the instructional videos and practice building a website along with the video, I think you will find that your frustrations are unfounded.

Bootstrap Studio is not a 100% WYSIWYG builder, but it gets pretty darn close while still producing 100% clean, SEMANTIC code. If you want something that requires absolutely no coding at all, you’d be better off with an application like Wix, or Weebly, or Nicepage, or Squarespace. Even those platforms offer more advanced users the ability to customize the CSS (albeit with a much higher learning curve than Bootstrap Studio) but be prepared to pay an annual fee anywhere from $200 to $500 a year.

Or you can go with something like Wordpress, which also requires no coding, and comes with its own litany of headaches.

1 Like

The 100% clean semantic code output is what I kind of care about so inline styles piss me off, they’re not needed and even more so not required as default behaviour, why was this approach decided upon by your development team?

The point of a framework is so that we don’t have to reinvent the wheel. Bootstrap was mainly created to enable a person to build responsive websites quickly without have to create their own grid layouts with media queries and breakpoints. It provided a set of pre-made breakpoints, and a grid system using containers, rows and columns that saved a lot of time. Most people who use Bootstrap, use it because it has this built-in responsive layout. All the other features like buttons and panels and carousels and menus are just icing on the cake.

If you want to change the core Bootstrap framework, simply copy the desired Bootstrap classes to your a custom stylesheet, and edit the CSS (or use SASS to generate a customized version of Bootstrap)

People who use Bootstrap and Bootstrap Studio generally do so because they DON’T want to change the framework. They don’t want to redo all the work that the creators of Bootstrap did in the first place.

We are just users, like yourself. We are not the developers of BSS, and as both @jo-r and I have explained more than once, you are not forced to use inline styles. This is simply how the program applies customization through the APPEARANCE panel. If you customize your website using Bootstrap utility classes and the Options panel, you will never have any inline styles.

If you don’t want to ever write any CSS, you may want to try a different field/hobby other than web development.

1 Like

I always understood bootstrap and any other contemporary web design framework as a decent set of CSS styles to use and adapt. I’m pretty sure that’s how they were publicised. The way I’ve ever used any design system from muller-brokmann to bootstrap is they are just suggestions not authority. I get pissed off if I cant change it.

There’s nothing we can do to help you with your anger issues.

Bootstrap works the way the designers intended. Bootstrap and other CSS frameworks were created to save developers time, eliminating the need to type out commonly used CSS rules over and over. It’s a lot easier to type py-4 if I want to add vertical padding to an element than to type:

.my-padding-vertical {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

And then add the my-padding-vertical class to your HTML elements.

If you want a different amount of padding, and py-1, py-2, py-3 and py-5 don’t work for you, then you’ve reached the limit of the Bootstrap framework, and you have to make your own custom padding class (or use SASS to generate a Bootstrap framework with paddings you prefer.)

With Bootstrap Studio, you can add whatever vertical padding you desire via the Attributes panel, and then extract the inline CSS that is generated to a custom stylesheet, and give those rules a class name that you desire, or you can just create your class directly using the CSS editor.

If you want to change the py-4 utility class to something other than padding-top: 1.5rem !important;
and padding-bottom: 1.5rem !important; you can do that as well by duplicating the Bootstrap class in your custom CSS file, and changing the values to whatever you want. Then you’ll have your own, slightly personalized Bootstrap framework.

But haphazardly overwriting Bootstrap utility classes is generally considered poor practice. It’s much better to create a unique class with a name that is meaningful to you (and anyone else who looks at your code.)

It sounds like you want to use the Bootstrap framework, but don’t want to be constrained by the predefined CSS that make it a framework. This begs the question, “why use Bootstrap in the first place?” People use Bootstrap so they don’t have to write CSS and can quickly create a good looking website with CSS classes that produce visually appealing layouts.

You might want to look into something like Tailwind, which allows far more customization of the stock utility classes.

2 Likes

Web developers have held the world in stagnation for far too long.

Lol… okay.

Is there anything else we can help you with in terms of using Bootstrap Studio?

1 Like

Can I edit bootstrap in the studio? That’s why I purchased it. Straight up editing and changing the framework.

You can download bootstrap source code here

remember it should be the same version as in bss

then import the scss files into bss, that will give you full control over the bootstrap framework
to start with add an empty css file as theme in the settings dialog in bss.

Now the only thing you have to do is change the bootstrap framework as you want it to be.

Good luck!

2 Likes