![]() In one case, a row of buttons that looked pristine in Blocs 2 got jumbled into a big lump in Blocs 3, requiring me to redo them. However, changes between Bootstrap 3 and 4 can make upgrading sites you built in older versions of Blocs a little bumpy. This popular web design framework has support for mobile devices and their flexible screen sizes built in, and the upgrade improves both what Blocs 3's brics can do, and its ability to make the same page work well at various breakpoints. … for professional codersīlocs 3's code base is now built on Bootstrap 4, up from its predecessor's Bootstrap 3. The latter include, but are not limited to, "masonry" image galleries, with clusters of different-sized images tabbed content boxes an audio player and accordion content boxes that open and close as you select their headers. Soon you, too, can be rolling like they do in Cupertino.īlocs 3 also offers a bunch of new blocs and brics to jazz up your sites. Just select an element, choose how it will scroll in or out, and whether and how it will fade in. You know how product pages on Apple's site have all kinds of impressive fade-ins and animations, with text and images appearing as you scroll? The ScrollFX controls in the Inspector pane make that wizardry absurdly easy. … for amateur site-buildersįor those who just want to point and click their way to coolness, Blocs 3's ScrollFX may be its best new feature. If all these new features prove confusing, just consult the pop-over keyboard shortcut guide now located under the Help menu.įinally, and perhaps most amusingly, Blocs 3 gets its Mojave mojo working by adding … not a dark mode, because it's always had a dark interface, but a light mode, just in case you miss that familiar Macintosh bright gray. Better yet, you can later go into that custom class to rename it, fine-tune its styling, or even copy it to apply to other elements on the page.įor designers who crave structure, Blocs 3 now offers page guides, toggled with the G key, to help you plan out your page. To record these adjustments, Blocs creates a custom class for that element, rewriting the CSS code as you change things. You can now drag and move buttons on the side of a selected element to alter CSS properties such as its width, margin, or border radius by hand. Once you've got elements on the page, Blocs's new Freehand technology gives you more power to adjust how they look. ![]() Again, this makes adding new chunks of code much faster and more convenient. Rather than making you scroll through rows of abstract icons, thumbnails now show you exactly what each bloc will look like, with a search bar and the ability to quickly narrow your selection by category. You can even reorder elements on the page just by moving them up and down in the list.īlocs 3 moves its Inspector pane, where you can customize aspects of a selected element, to the right of the screen, where it now shares space with the searchable bric library.īlocs 3 has similarly refreshed the process of adding whole new blocs. It's much easier to select individual elements on the page this way – and to see when you've accidentally crufted up your code, as I realized I'd done with some poorly placed tags. The left side of Blocs 3's window now lists every element on your page hierarchically, showing you a clear structure of your page's underlying code. What's new in Blocs 3 … for everyoneīlocs 3 gives the entire program a welcome facelift, refining an already sleek interface to be even more user-friendly, and making style tweaks and adjustments even more intuitive. You can also easily add analytics code or additional JavaScript or CSS files to individual pages or your entire site. It now builds in support for various free and paid content management systems, including Pulse, October, Cushy, and Surreal, letting users drop in fields and elements that can work seamlessly with those systems' databases. In the four years and two successive versions since its creation, Blocs has quietly accumulated pro-friendly features without significantly steepening its learning curve.
0 Comments
Leave a Reply. |