Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

App Web Viewer

Avatar

Avatar
Validate 10
Level 2
lkjdfaslkdfas
Level 2

Likes

11 likes

Total Posts

48 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile

Avatar
Validate 10
Level 2
lkjdfaslkdfas
Level 2

Likes

11 likes

Total Posts

48 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile
lkjdfaslkdfas
Level 2

04-02-2016

Hi.

Been working with the web viewer and still trying to figure out how "exactly" to get the content to position itself correctly on my screen, when viewed in a web browser like chrome or firefox.

Is there any kind of rule of thumb? like design your "Web App" for a specific browser size? 1280 x 720 (just an example).  I have both a retina screen and 24" 1920 x 1080 resolution screen. Trying to get my content to appear "correctly" on the screen with a layout that somewhat resembles my "Tablet" layout has been nothing but utter failure.

Anyone have some information they might like to share etc...

thank you.

Accepted Solutions (0)

Answers (7)

Answers (7)

Avatar

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile
Colin_Fleming
Level 4

10-02-2016

Keep in mind, when you set a dimension while working on a layout rendition it's only for visualizing in the Layout Templates system. You are not setting the dimension of your reader's browser window when they're using the web viewer. They could change the size of their browser window at any time.

The "Make Default" sets a layout rendition (tablet initially is the default) to be used as the starting point when you add a new layout rendition. HELP explains this.

So initially, tablet is the default. When you add a phone rendition it inherits all the settings for layout and cards from the tablet layout rendition. And then you change how the layout rendition for phone is different.

Then you might add a web viewer layout rendition, and it starts with the tablet settings. Then you change how the web viewer layout and cards work.

So any one of the three layout renditions could be set as default, and it becomes the starting point when you add a new layout rendition.

HTH -- Colin

Avatar

Avatar
Validate 10
Level 2
lkjdfaslkdfas
Level 2

Likes

11 likes

Total Posts

48 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile

Avatar
Validate 10
Level 2
lkjdfaslkdfas
Level 2

Likes

11 likes

Total Posts

48 posts

Correct Reply

1 solution
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile
lkjdfaslkdfas
Level 2

10-02-2016

Hi Colin,

I am using Renditions and would like to know.... When design the "Web" rendition, I have chosen 1920 x 1080 (Large Screen) for my layout.  Can I click the "Make Default" for this? or will that now over-ride the Tablet Layout?

Avatar

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile
Colin_Fleming
Level 4

08-02-2016

You get one web layout rendition. So maybe I don't understand your question.

Avatar

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile
Colin_Fleming
Level 4

08-02-2016

No specific experience with blank cards in web viewer, sorry. OTOH, my challenge with throwing blank cards into a collection to control spacing is that you have to do extra work to manage these additional pieces of content, even if they're invisible. If I want to push things down, I _would_ use a top margin.

Avatar

Avatar
Validate 10
Level 2
10TonMedia
Level 2

Likes

13 likes

Total Posts

45 posts

Correct Reply

0 solutions
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile

Avatar
Validate 10
Level 2
10TonMedia
Level 2

Likes

13 likes

Total Posts

45 posts

Correct Reply

0 solutions
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile
10TonMedia
Level 2

08-02-2016

I forgot to ask directly about Web Viewer sizes.  How many renditions do account for when designing for the web viewer? just the common 3 or 4? or 1 main?

Avatar

Avatar
Validate 10
Level 2
10TonMedia
Level 2

Likes

13 likes

Total Posts

45 posts

Correct Reply

0 solutions
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile

Avatar
Validate 10
Level 2
10TonMedia
Level 2

Likes

13 likes

Total Posts

45 posts

Correct Reply

0 solutions
Top badges earned
Validate 10
Validate 1
Boost 5
Boost 3
Boost 10
View profile
10TonMedia
Level 2

07-02-2016

Thanks Colin,

have you had any issues with a "blank" card? for web view?  I am using a blank card to push my cards down, instead of the "Top Margin".

Avatar

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile

Avatar
Boost 5
Level 4
Colin_Fleming
Level 4

Likes

37 likes

Total Posts

160 posts

Correct Reply

35 solutions
Top badges earned
Boost 5
Boost 3
Boost 25
Boost 10
Boost 1
View profile
Colin_Fleming
Level 4

05-02-2016

I doubt you can expect a browser to be a certain size, and I agree that making the tablet design look good on a desktop is difficult.

Have you taken a look at "layout renditions" in Layout Templates?

I typically start by designing for tablet, then you can add layout renditions for phone and web viewer. This might help.

My process (developed with Bob Bringhurst) is to create a framework of controls (add the cards I expect to use but don't design them, then add the mapping rules that will control card use) and eventually "design" things by adjusting the properties for the layout and cards. The advantage of this approach is that I get to see a variety of cards in the layout view and adjust as I design. It's a little blind initially, but we like the approach.

Once the tablet is working the way we like, we add a layout rendition (for phone or web view.) And then we adjust the layout and/or cards to work on the different device/desktop class. All setting from the tablet layout rendition are copied into the new rendition, and then changes are made.

This should help with controlling the web viewer experience.

HTH