Two questions: Global sidebar and displaying pdf


#1

Hi all,

I have two questions before I (probably) will buy Blocs. Have been looking around without any success so far…

Is there a simple (no coding needed) way to create a sote with a global sidebar of the left side, appearing on all pages, with vertical menu linking to pages (which will be opened in the ‘main area’ when clicking on their titles in the sidebar menu?

Can Blocs display a full pdf file as one page if I upload one (and how do I do that?), or do I need to recreate the pdf using Blocs’ tools?

Thanks in advance.


#2

You can create a sidebar menu. Typically you would use a two column row in a bric and then adjust the column widths so you have a narrow column on the left and a wide column on the right. Create your menu in the left column and add your content to the right one. If you want to have the same column structure right down the page, just duplicate the two column block as many times as needed for your page. If you want the page to be used throughout your site i.e. every page with the same structure, create a blank page with the two column bric and save it as a template. You can then use it over again as many times as needed.

Blocs Itself doesn’t display a PDF page. PDF’s are rendered by the browser if an appropriate plugin is installed on the visitors computer. This will cause the PDF to display in a new window/tab when a pdf link is clicked. If the user doesn’t have a plugin enabled in the browser, the file will be downloaded to the user’s computer.


#3

Thanks for the help, Hendon!

I think I have created a two column ‘thing’, but when I click on it, it changes it’s look from displaying two columns to showing only one.

And If I search in the Help area and type “menu”, I don’t find anything which explains how I can create a menu.

I can’t find a manual either.

I wish this would have been more self-explanatory.


#4

Follow the instruction in @Eldar 's video HERE.

The video explains how to make a full screen/multi-page site with the navigation on the left of the screen. The reason that a full screen site has been used is because it keeps the menu in view at all times while browsing the site. If you need a lot of content in each page, you should turn off the full-screen padding option and choose one of the other options. (appearance section in the settings sidebar). This will have the effect of having your side menu scroll out of view as you scroll down the page. However, you can always enable the back to top feature so visitors can get back to the menu easily.

If you choose the longer page option, you can duplicate either the left or right block for subsequent sections of the page. Just remember to delete the menu from the other blocs on the page, otherwise it will look odd having several menus on the page. Best to style the blocks in terms of background colours/images etc before duplicating - it saves you work later on. Note: duplicating just one of the blocs will automatically duplicate both.


#5

Thanks a lot for that link, Hendon. That was a lot of steps to be remembered for a newbie! Personally, I prefer drag and drop solutions, and solutions which require as few steps as possible. Ideally, this should (IMO, of course!) be doable with a command saying something like Create Navigation Sidebar combined with a way to for instance drag the pages one wants listed into that area - or another way to define it with one click operations. I just saw another solution, where all existing pages automatically were entered in a similar menu, so with all due respect for Blocs and its many great features, I guess I’ll go for another solution for now, and look at Blocs again when the app looks more streamlined (again, of course: streamlined according to my definition of streamlined! :slight_smile: )
Thanks again.


#6

Since I believe I like the main concept behind Blocs, I’m trying to do what is shown in the video above. First I had a hard time trying to find out how one would display the Bric area (is there a menu command for that, or contextual menu that displays it? Or a mouse based way?)
I’ve come across a number of UI surprises. Sometimes, when I click on an area, it is being transformed to something else, even if there isn’t any indication in the mouse icon suggesting that a click is about to insert something or change something. Is there a way to avoid that? For instance, if I click in the grey “Empty Li” object here (see attached pic), it changes what I look at to three lines only, one of them saying “Empty Li” and the other two “Empty Content”.
Why does this happen?
And why is one “Empty Li” blue, and the other gray?
Why is there empty space between some of the lines, and how do I get rid of that?
Or, in general… how do I clean up the somehow messy result I’ve ended up with so far (other than starting from the beginning again, which I have done a few times already)?

And how do I create a sidebar with, say, 4 or 7 items, without ending up with empty areas?

I’m very familiar with Mac software in general, but still - it has taken me about an hour so far to create a sidebar with a navigation menu, and I’m still not there.

Thanks in advance.


#7

Here is, btw, what this area changes to if I double click on the upper gray area.


#8

I think you may not have fully understood the basics of building a site in BlocsApp. The page comprises of two basic elements - blocs and brics. A bloc is added to a page by clicking in the empty global area of the page. Doing this will display a set of thumbnails of pre-made blocks. Selecting one will add that bloc to the page and allow you to edit it’s content (if it has any) See image below.

If you select a simple full width block with no content, you can add items to it to create your own bloc style. You add content to the bloc by adding brics. A bric will automatically size to the width of the column you add it to. So, if you don’t want your content full width, you would use one of the multi column blocs and then add your brics to the columns. In the screenshot below, I’ve added a three column bloc to the page. Each column shows the word empty because no content items have been added.

If I now choose a list bric and add it to the first column, I will get a pre-made list item comprising of three lines. Each of the lines are just content areas and will initially show as empty (just like the columns in a bloc). Here is how it looks:

If you want more items in the list, just select the list item and change the number of items in the sidebar.

Once your list bric is placed, you can now add content to the empty spaces. In most cases the content will be a simple text or heading bric. Simply select the bric and then click in each empty space like so:

Note: when you hover over a content area when you’ve selected a bric, it turns blue. This indicates that you are about to place content into that content area.

As you add content, the word empty LI is replaced with the content bric - in the example above, a heading bric was placed in the first two empty lines. You can now edit the text by selecting it.

The only thing you must remember is that if you click more than once in any content area, you will add additional brics. To avoid this, once a bric is placed, hit the esc key on your keyboard.

The spacing of objects within blocs and brics is set at an optimal value by default. This ensures that the content is easily viewed and optimally spaced for all devices. However, you can change any of the spacing options by adding a custom class and increasing/decreasing margins and padding.


#9

Thanks for you reply. Maybe that is the culprit that has caused so much unexpected behaviour when I tried out the demo.
Since my last question I went for another app, which had a (for me) more straightforward workflow in terms of my two main concerns with Blocs; one of them being the constant surprises I got (maybe because my mouse was in insert-bric-mode without indicating that visually), but I can’t go back and check that since the demo period was as short as it was. The other thing that was clearly easier in the other app was creating navigation bars. But Blocs has stuff I really like too, and the other app had some issues that took a long time to sort out.

If I go for Blocs, I’ll probably wait until Blocs 3 is out - I guess there will be a new chance for a short demo period then? I hope so, because my impression is that Blocs may be more advanced in some areas, but also has a much steeper learning curve.


#10

As everyone else is dealing with the sidebar menu I have yet to see someone mention displaying a PDF not only enabling a download via a Button or Link.

The easiest way to display a PDF inside the site (embedded if you wish) is to put it inside an HTML Bric

Then put it inside an iframe

> <iframe src="http://mywebsiteurl.com/myfilepath.pdf" width="100%" height="800" frameborder="0" allowfullscreen="allowfullscreen" class=""></iframe>

This will display the PDF file you uploaded to your site.

Hope this helps.