Non-Coder seeking expertise of Coders, please!

I Need Help
1

Hi – So, I’m venturing into new territory for me…and I’ve gotten this far. I’m experimenting with using a Bootstrap TAB_PILL element in my Blocs project as I need TABs for my design.

I found some code for this on w3school in the Bootstrap section, and after changing the label names using the code editor Brackets, I copy-pasted the relevant ‘body’ bits into the HTML Bric, and it renders and functions in Safari & Chrome when I browser ‘preview’ it in Blocs [see image #1].

Safari Render
Safari Render1395×672 345 KB

Here’s my question: The w3School code has 3 lines in the Head section: 1 link to a style sheet, and 2 for scripts.

Code In Bracket
Code In Bracket1397×562 439 KB

Can I override the linked stylesheet Blocs generates for Bootstrap, and style the TAB_PILL as I wish using my own CSS file, and attach my CSS file using the ‘Page Settings’ ‘Header File Attachment’ section? And then, can I use Blocs ‘classes’ in any way to add more styling options to the TAB_PILL? Or, do I get a hold of the Bootstrap CSS and edit that (is that possible) and then attach it to ‘Header File Attachment’ section for the Page??

Or, am I asking questions that are a bit out of reach at the moment for Blocs…

I want to replicate what I currently have on my live site at www.danielfactor.com in the SERVICES & APPROACH section.

Thanks in advance.

2

These scripts are included by blocsapp and make the website work.

One script is for the JQuery system and the other for the Bootstrap system.

Regardless of how websites are created the links are to repositories for the code for these systems and they are not required to be edited, nor should you have any need to edit them.

1 Like
3

Thanks pauland – This is now making more sense to me. Blocs generates all the scripts necessary, due to Blocs being based on the Bootstrap framework. Would the same be true for Foundations code snippets? Just curious as to the scope of what scripts Blocs will generate.

Regarding the Bootstrap linked stylesheet, can I override that by creating my own CSS file and attaching it to the ‘Header File Attachment’ in the ‘page settings’? Or is that beyond Blocs at the moment, and more a job for something like Pinegrow?

Thanks for clarifying!!

[P.S. I edited my original question now that I understand the answer you provided]

4

Daniel, blocsapp is really about not coding unless you have to. COmparing it to pinegrow or tool X is not the way to go - especially if you are new to coding.

Basically blocsapp is using bootstrap for all it’s layout and also sucking in jquery. Besides that it adds it’s own javascript code.

If you wish to extend blocsapp with snippets etc, you really need to understand how that snippet works and what needs to be added to your build for it to work. This can include references to javascript that may or may not need to be added to your project or simply added elsewhere.

Typically this will be done using a HTML brick for the HTML part of the snippet and for javascript you may need to add script files to the blocsapp project.

5

Thanks pauland – Your replies are so helpful, as they orient me to the scope of the tool! btw, i’m not intending to “compare” one app to another…but rather am learning to comprehend if I’m using the tool correctly, and so am experimenting as a learning exercise for my own pleasure.

My understanding from your two clarifying replies is that I can’t re-style the bootstrap Tab_Pill in blocsapp. Did I get that correct?

Much gratitude to you!!

6

I would say there’s no can’t in blocsapp. Whether you can do it or not depends on your skills. Before you wonder or ask, I am not going to attempt to do it (I dont have the spare time to invest in working it out), but I believe it’s entirely possible. I had a feeling someone had made a custom bric for tabs.

This is not so much about blocaspp but about restyling a widget and since it’s not a native part of blocsapp it has nothing to do with blocsapp as such.

7

Ah, worry not, as it never crossed my mind to ask for someone to do for me what I’m exploring doing for myself!! And yes, Bill is working on a Tab bric via the API tools.

So, my basic take away from your helpful replies, is blocsapp is not designed with the capability to insert non-native bootstrap script-driven components that would require custom CSS files to make changes to the default CSS — with the caveat that with advanced coding skills, a ‘hack’ could be found to do so?

What’s curious to me is the quantity of ‘code’ related questions throughout the Forum, suggesting many folks are wanting to work (at varying levels of skill) with code in blocapp, which the HTML bric + Header File Attchment addition suggest provides some native coding functionality. The scope & breath of these tools are not explicitly described or documented, other than the warning message about ‘plain html’ only in the bric. My guess is the addition of these tools has been driven by requests, making blocsapp more flexible as a tool for a wider range of skill-level users.

8

Totally incorrect. Blocsapp is designed to allow people to make great websites without coding, but if you want to add code you can. The Class manager takes care of most styling situations.

Writing your own additional code is not hacking blocsapp.

That is fair to say, I think.

9

Great! We are zeroing in on my original question: if I create a style sheet and attach it to the page where I placed the HTML bric w/ the bootstrap tab snippet, and properly link it using Header File attachment will this customize the Tab-Pill if I learn the necessary syntax, and accurately name .classes and id# for the associated script?

10

Daniel, if you learn enough you can do anything.

11

Excellent! This dialogue is so helpful.

So, to summarize in regards to inserting code for the Tab_pill in question the procedure in blocs would be attaching a new CSS file to override the default bootstrap linked stylesheet?

12

Daniel, I’m sorry I can’t sort out your tab a question at a time.

I hope it goes well.

13

Thanks for the exchange!

14

This is not a complaint. Although it may sound that way. It’s some friendly free advice…and you know what that’s worth. :slight_smile:
I’m hoping that Blocs includes more “without code” Brics soon. It will make a good app a great app.

Many developers make a huge business mistake thinking that third part development can take care of the “standard faire” necessary for building websites.
I started to list them but there are too many missing.

The main issue a side from the inconvenience of “searching for solutions” elsewhere is that when third party widgets/Brics or whatever you want to call them break or don’t work we have to chase down a fix. Support can be sparse or non existent. As was the case with many Muse third party widgets. Even Muse Themes struggled to keep up with changes that broke there widgets as Muse made changes to code.

When I buy a new car I don’t want to have go to the company that made the tires when there is a problem.
I want to go to company I made my car purchase from.

I fully understand the need for third party botique Brics or widgets. Those are great if someone wants to try something different. But some of these cost nearly half the cost of Blocs! I could easily end up spending a few hundred dollars more than Blocs itself.

There was a reason a billion dollar company like Adobe couldn’t get it together …it wasn’t for lack of talent …it was and is poor management. It’s the reason 80 percent of businesses fail.

They just didn’t listen to thier customers or potential customers. Instead they allowed present users of the app.to be the face of their company (Muse) or (Dreamweaver). Fielding and answering questions as well as beta testing the app. Nothing wrong with beta testing users but when all your testing is from users saying “no…it’s still not fixed!” That’s a sad situation.
Most of that should be the companies responsibility.
Many of those self appointed defenders if the app attacked the hand that was about to feed the company.

Daniel just wanted a Tabbed Bric. Drag and drop. It is a commonly used function. Even if it were not it would be good to get on with providing as many native useful functions as found elsewhere. For example in Word Press (I’m not in love with it but many companies use it) Divibuilder has nearly every thing you can imagine.
Yes there is always more. Yoast SEO.

It took Muse 7 years to get to where they did and then ended up dropping Muse as a failure. Why? Just bloated code? Too expensive?

Pinegrow is not Blocs for sure but I find myself and others are using it to view code they can’t as easily access or see in Blocs. Or at least not as intuitively.
That probably wouldn’t matter that much if we didn’t actually find it necessary to want to style things a bit.
Centering text on a mobile menu. An audio player, a tabbed panel. Accordion panel, etc…simple things.

I may have a few things wrong here in regards to what is possible in Blocs. I think it’s true if you want to take the time to learn some code you can do almost anything…but then the competitors will find a way to listen to those who just want to drag and drop design visually with freedom of “no code” environment.

Please take this in the right spirit. It’s meant to be helpful insight that can be used or not.
I believe Norm is one of the most passionate people I’ve encountered about what they do. I love that.
He also has demonstrated a keen desire listen and to help his users. That is going to take Blocs a long long
way into the future.

I’ll remain quiet now. I’ve said my part…:slight_smile:

2 Likes
15

Hi HMM – True to the quote above, but I started this particular post for another purpose, which pauland was partially able to answer, but was unable to answer this straightforward question:

  • do you know if I can override the Bootstrap stylesheet that blocsapp generates for the Bootstrap Tab_Pill HTML code I successfully used in the HTML bric (as I show I ably did in the screen capture above)

  • and if yes, is this achieved by using the Header File Attachment setting to attach my own new CSS file, in the Page Settings of the page I have the code snippet on?

I think this is a pretty straight forward question…or am I mistaken? My interest is purely educational and explorative in nature…

1 Like
16

Hi pauland – I just stumbled on to another ‘post’ that is similar to my question here, and so to support your learning about it, as well as mine, here it is:

Norm answered the question succinctly…so I hope that’s helpful to you, as it is for me! :slight_smile:

17

It’s beginning to look to me like there is a lot of coding required. I think if many more Blocs and Brics were included adding classes etc would not be necessary for most users who would come to use the Blocs platform.
But…I’m finding that I’m spending an awful lot of time entering into the “code/class” world…I did not really want to be in for sake of time and efficiency. I’m reading about others elsewhere making the same or other critisms.
Consider adding a lot more Brics and Blocs for a fully complete “out of the box” web design app.
I can pretty much go into Pinegrow or Dreamweaver and pull up a Bootstrap block of elements, that I can see all the code by the way and accomplish the same tasks.
Blocs is on the right path but in my opinion needs to include many more useable Brics and Blocs ready to go.

Just suggesting …not that you don’t want to hear from the users who are happy…but you definitely would want to hear from those who just moved on and left Blocs without telling you why. It gives you the golden opportunity to improve a good program…and get more customers.

1 Like
19

Hi HMM – I’m coming to agree with this same perspective. As I continue to explore Blocs, I’m also finding a need to learn the basics of coding (HTML, CSS…and just beginning with Javascript)…and the question is ‘why?’

My experience with Blocs so far is that in its simplicity and beauty (and gosh darn is it pretty!!), it ‘feels’ in hand to be stiff and restricting, and this appears to me to be due to it’s foundation of Bootstrap. Of course, as a Muse user, it makes sense that I would feel this way…changing from a freeform canvas to a grid system is going to be like that!

Blocs actually redefines what drag & drop means. It’s not the wysiwyg version of drag & drop like Muse is, but rather is a ‘container’ drag & drop solution, and so it is structural not graphical. This is a huge difference in philosophy and therefore design experience. This is true for the other Framework based tools out there, too!

Classes is an understandable solution to increase (some) flexibility in styling/layout, but this solution adds another kind of project management complexity. To truly do well with classes there needs to be some html & css & Javascript skills in order to avoid the pot holes and frustrations of a bumpy design ride (again coming from Muse), unless one accepts being constrained by the out-of-the box mandated website construction process that favors structure over freedom, and that Blocs does very very well at, and deserves real praise for.

Oddly, as you suggest, if i can master sufficiently html,css/js/php in order to independently control Blocs, then Pinegrow does become more attractive due to its open nature. The question for me is ‘will I sufficiently master’ those coding languages, and if not, then Blocs is an alternative to Muse.

One thought I have (now that I’ve learned about it) is wether or not CSS GRID can be incorporated into Blocs?? This would add more flexibility to layout, which my guess is would change the user experience while designing.

Now, if API does provide what I hope it will, that will be a fantastic step forward, not withstanding your argument of preferring native Blocs-brics, rather then relying on 3rd party creatives. But your concerns could also be a smoother experience in Blocs than it was with Muse if the 3rd party folks and Norm are cozy and well-coordinated.

Time will tell…

As i’ve learned as a former architect, simplicity often takes greater effort to pull off gracefully than the term ‘simplicity’ implies.

1 Like
20

Yes…I understand. Having been involved in architectural and as a magazine editor …
Layout is basically Blocs…spacial perception etc.
The mixed purpose of a website is first to give information presented in a useable format …UX

You know the crazy stuff architects have come up with over the years…some a great some really bad not livable or usable spaces but boy did they win some awards.

The trend for websites is a “layer cake” delivery. We expect the nav at the top. Yeah…real clever…let’s move it below the fold where no one will see it. Crazy.
Similar to let’s move the steering wheel to the back seat…that will really be different. LOL.

I do think Blocs is or would be easier with many more Brics and blocks included to cover more (not all!) Design scenarios.

A mobile menu with left, center, right. I don’t want to create the code I could just as easily do in Pinegrow or any editor. That’s what I thought the whole idea was of drag and drop even if it’s bootstrap. :grinning::slight_smile:

1 Like
21

…we used have these design philosophy conversations all the time about wether ‘bigger, faster, newer’ equated to better! Of course it doesn’t. When function governs form, and form is ‘responsive’ to function, then nature prevails, and when nature prevails, beauty is evident.

Blocs is beautiful, and the question remains if its beauty constrains function or enhances it.

2 Likes