Migrating from MUSE to BACKLIGHT - advice needed

johnblaustein · 2018-02-06 15:03:56

Hi,

My current website is built using Adobe Muse: http://www.johnblaustein.com/

I am considering moving from Muse to Backlight because of how Backlight's responsive design seamlessly works on desktop, tablet and mobile phone devices. (Muse has become a little more complicated than I can keep up with.) In addition to my website, I use TTG's Grid Gallery Plugin for LR, now the 2018 version, for making web galleries for clients. I love how this plug-in displays images, and I would like to incorporate that into my website.

I have a few questions regarding the migration from Muse to Backlight:

1) Looking at my current site, will I be able to duplicate the look and functionality using Backlight? I know my slideshows will be replaced by galleries--thumbnail grid clickable to slideshow--but I'd like the menu structure to remain pretty much the same.

2) If I buy and install Backlight, I would like to leave my current site in place until I'm ready to go live with Backlight. I read a post on this forum, and if I understand it correctly, I can set up a sub-domain on my current site and install Backlight there. When I'm ready to go live, I would simply delete all of the files of my current site and copy the Backlight files from the sub-domain to the main domain home folder. For example, I could create www.johnblaustein.com/backlight (or backlight.johnblaustein.com) and use that for my development work. Is that correct? Is it really that simple?

3) Is it possible in Backlight to have a gallery that simply displays a slideshow without starting at a thumbnail grid page? This would be similar to how my current site looks and operates. Is this what the Galleria add-on does? Or is this Theater?

4) Can you explain, please, what Theater does that Galleria doesn't do? (I've looked at the samples, but I'm still not clear.)

5) Are there any online tutorials? I've looked at the 2-3 YouTube videos, but I'm wondering if there are others.

Thanks very much for your help.

John

Matthew · 2018-02-06 15:38:03

Hi John,

To your first question, will you be able to duplicate the look of your existing site using Backlight, I'd say yes! If we break down your layout, you basically have:

1. a header running across the top with logo graphic and navigation menu.
2. a three-column body with side navigation of albums
3. an inline slideshow type gallery presentation

This pretty simple with Backlight. For the masthead, you can get a solid overview of our mastheads and overall design paradigm in this tutorial: http://theturninggate.net/2017/11/16/ma … -masthead/.

The navigation can be a part of the masthead, immediately below the masthead, or placed into one of the side columns.

Backlight's page templates can be designed with one, two or three columns. You can create and use multiple templates, so if you want three columns on the About page, and a single-column Home page, you can do that.

And for the slideshows, you might consider the Galleria Add-on. Else you can use the album capabilities built into Backlight's core application, which are similar to the Grid Gallery you already have experience with, but with a larger feature pool.

The only thing that might give pause is that there's no automated way of putting the album menu into the sidebar, separate from the main navigation. But you could address that yourself using custom content, or PHPlugins. So I'd say it's doable, and not terribly difficult to do.

Q2, about developing and moving. Yes, you can do that. Rod has helmed many posts on the forum about that very thing, so I'll just direct you to one of those for more information. http://community.theturninggate.net/vie … hp?id=8433

Q3, the Galleria Add-on is probably the better option. The Theater Add-on offers a similar presentation type, but it's features are more limited in scope, by comparison.

Q4, Galleria has the superior slideshow. The slideshow included in Theater is more the background variety, with fewer options for user interaction. I addressed these differences briefly on the blog when we launched the Galleria Add-on (http://theturninggate.net/2018/01/15/ne … lable-now/). Beyond that, the Theater Add-on includes other, different presentation types, like image comparison, video staging, etc.

Of the albums at http://theturninggate.net/galleries/01- … strations/, the Theater Add-on powers all albums from "Full-screen Slideshow", though to "Flexstrip".

Q5, we have documentation, some tutorials on the blog and YouTube, and we have this forum (including a Backlight Tips & Tricks section). Rod also runs a tips & tricks site, http://ttg-tips-and-tricks.barbeephoto.com/.

johnblaustein · 2018-02-07 02:25:11

Matthew,

I can't thank you enough for the thoroughness of your reply. You answered all of my questions.

Rod describes the sub-domain issue here, and it looks reasonably easy to do:
http://ttg-tips-and-tricks.barbeephoto. … ub-domain/

Again, many thanks!

John

johnblaustein · 2018-02-10 01:20:35

Matthew,

I am reading everything I can find about how to set up and use Backlight. Between the documentation, Rod's site and YouTube, I'm getting a good sense of how to proceed.

2 questions:

1) I know I can use your Cart system in order to take PayPal payments, but my needs are very simple since I only sell one product on my site. Will Backlight allow me to insert a PayPal button as I have done on my current site? For example, see the button at the bottom of this page:

http://www.johnblaustein.com/buy-the-book.html

2) I use two PCs, a desktop on which I work with Lightroom, and a laptop. If I do all of my album creation on the desktop and publish them to Backlight from the desktop, will I be able to work on my site on the laptop? If I understand Backlight correctly, once it is installed on the server--I will install it into a sub-domain--and once the albums are uploaded to the server, then I can log onto the site using a browser on any computer. Other than the LR publisher plug-in, all Backlight files reside on the server. Is this all correct?

Thank you.

John

rod barbee · 2018-02-10 01:39:16

Will Backlight allow me to insert a PayPal button as I have done on my current site?

Yes. You can either use it in conjunction with the Cart or you can simply insert the html thatyou get from PayPal into the page copy.
For stand-alone buttons to purchase a product using TTG Cart: http://backlight.theturninggate.net/doc … se_buttons

2) I use two PCs, a desktop on which I work with Lightroom, and a laptop. If I do all of my album creation on the desktop and publish them to Backlight from the desktop, will I be able to work on my site on the laptop?

You can work on design elements, create new templates and create pages.
The only thing you can't do is control existing albums and album sets. UNLESS you're using the exact same catalog. Everything created via Publisher is catalog specific.
You can sort of get by this by using the Lightroom Voyager plug-in to transfer published collections and their contained photos from one catalog to another.
https://alloyphoto.com/plugins/lrvoyager/

You can, of course, use a different catalog on your laptop and set up Publisher to publish to your site. You won't be able to publish into existing album sets (other than the top-level gallery). You can create new sets and new albums. But these won't be controllable from your desktop unless you use Lightroom Voyager to transfer the published collections from your laptop catalog to the desktop catalog.

Other than the LR publisher plug-in, all Backlight files reside on the server. Is this all correct?

correct.

johnblaustein · 2018-02-10 03:49:40

Rod,

Thank you.

1) OK on PayPal button. I am pleased to know that I can simply insert the HTML from PayPal to display the button as I currently do. I prefer not to use a Cart, and now I know that's possible.

2) I appreciate the explanation of Voyager and using the same catalog on two computers, but I won't need that. I would just like to work on the design elements on the laptop once the albums are on the server in my sub-domain.

I think I need to just install Backlight and dive in, but I tend to try and understand new software before making the leap. With that in mind, one more question for now:

In LR, I have collections for each of my 8 galleries. Once I have Backlight installed into my sub-domain, can I start by using LR Publisher to upload all 8 galleries to the server, or do I have to create the pages and/or menu items in BL before publishing each gallery?

John

rod barbee · 2018-02-10 04:28:05

johnblaustein wrote:

Rod,

I think I need to just install Backlight and dive in, but I tend to try and understand new software before making the leap. With that in mind, one more question for now:
In LR, I have collections for each of my 8 galleries. Once I have Backlight installed into my sub-domain, can I start by using LR Publisher to upload all 8 galleries to the server, or do I have to create the pages and/or menu items in BL before publishing each gallery?
John

Just publish them to your top-level galleries folder. Menu items will appear automatically as long as you've enabled Descendants for the Galleries page in your menu set.

johnblaustein · 2018-02-10 05:19:04

OK, I understand that.

However, I am hoping to have two galleries pages, similar to my current website:

http://www.johnblaustein.com/index.html

I am hoping Backlight will allow me to have the equivalent of the "Commercial Work" and "Hidden Canyon" links in my menu bar. I don't need the sub-menus on the left side of those two pages as I now have them. Those can be in the dropdowns from "Commercial Work" and "Hidden Canyon."

To confirm: Can I have more than one menu item that each points to different galleries? (I assume so.)

rod barbee · 2018-02-10 05:42:40

no problem.
The Menu Sets are very flexible. You could create a page for Hidden Canyon and just place the picture of the book cover in it using html. The Theater module has an option for single image. If using a Theater album, then the Link to: setting will be Album.

In your menu set, create an item for Hidden Canyon and link it to the page or album you created.

In the Hidden Canyon menu item, click Add in the lower right and add another menu item. This will add a sub-menu item. This item might be linked to an album of pictures from the book.

Continue to add items to the Hidden Canyon menu item.

Do the same for Commercial Work.

johnblaustein · 2018-02-10 05:57:12

Great. Now it's time for me to buy BL, install it, and dive in.

Getting back to my question about publishing my 8 galleries all at once, if I install BL, set the initial gallery that's created in the installation to accept Descendants, then upload my 8 galleries, will I be able to reorganize which galleries go in which menu set? Or, would I be better off creating my menu structure first and only publish the galleries once the various menus are in place?

I was thinking I'd use the Galleria module for my galleries, but I'll look at Theater. I'm happy to buy them both and experiment.

I managed to learn Dreamweaver and then Muse--even though it was tough going--and this MUST be much simpler once I get into it.

Many thanks for your time!

rod barbee · 2018-02-10 07:15:02

You'll be able to do what you want.
When you first publish an album to the top-level galleries directory, Backlight creates an Album Set, a page that "holds" albums. It's not an album (gallery) in itself, but an indexing page.
So what you'd be doing is publishing your eight albums into this page. You don't have to display this page if you don't want to, just don't add it to the navigation menu.
The albums published are then available to use by creating direct links to them or embedding them into stand-alone pages.

But to your question, you can create menu sets within your top-level galleries page and move albums into them. It's really easy.

But just looking at you have on your current site, I can tell you that it should be pretty easy to do what you want. I outlined above just one option. You'll find Backlight is pretty flexible.

johnblaustein · 2018-02-10 07:37:46

Got it!

I just purchased Backlight+Pages+Galleria+Theater. I will install it and get started. With a little luck, you won't hear from me for a while. <g>

Your help and quick responses are much appreciated!

John

rod barbee · 2018-02-10 08:05:31

If you get stuck, there are resources in the Tips and Tricks forum, my own TTG Tips and Tricks site (link in signature below), and of course, here on the forum!

A good place to start is Matt's video near the top of this page: http://backlight.theturninggate.net/docs/doku.php

johnblaustein · 2018-02-10 08:24:44

Yep, I've watched Matt's video several times and am aware of Tips & Tricks and your site.

By the way, this link isn't working--in the readme file within the Galleria ZIP:
http://backlight.theturninggate.net/doc … stallation

The corresponding link in the Theater folder readme worked, so I figured out where to install Galleria.

Thanks again....

John

Last edited by johnblaustein (2018-02-10 08:26:05)

rod barbee · 2018-02-10 08:33:09

yep, it's the same installation process.
Here's the link on the Docs page: http://backlight.theturninggate.net/doc … on_install

johnblaustein · 2018-02-11 03:57:49

Rod,

With your help yesterday, I'm off to a great start with Backlight. Thank you!

http://bklight.johnblaustein.com/home/ (Click the "Commercial Work" link for two slideshows.)

I've run into a few snags, in spite of having read your entire Tips page and the Tips section in the forum.

1) How to remove the copyright notice from the footer, other than make the text color match the background color (which is what I've done)? Deleting the copyright text from the Footer section of Page Design does not remove it.

2) On my iPhone, my site logo is centered, not right justified. Why? Do I need to use a smaller image file in Secondary Masthead section?

3) The "About" page is 3 columns, and displays oddly on the iPhone and iPad--two hamburger menu buttons to show the side columns. On this page, the menu changes from right to left side. I'm OK with the two side panels needing the menu button to display, but can the menu stay under the right menu button as it does on all 1-column pages?

http://bklight.johnblaustein.com/about/

4) When entering text, how to enter a list? Carriage returns are being ignored. How to add extra spaces between lines. See "About" page.

I am trying to make my Backlight "About" page match my current site:
http://bklight.johnblaustein.com/about/
http://www.johnblaustein.com/about.html

As you'll see, I've embedded a photo plus text in the left column, using this format pasted into the text box:

Test1
Test2
Test3

The photo does not display, and the text does not display as a list. It displays as: Test1 Test2 Test3

Also, the client list on the right should be single spaced (no blank space between items). When I paste the list in as single spaces, all text runs together, like Test1 Test2 Test3.

Also on the "About" page, in the center column, I've entered several carriage returns to "push" some of the text lower, but the extra spaces are being ignored. How can I add extra line spaces?

On the subject of embedding, to add a PayPal button, do I simple paste the HTML from PayPal's site into one of the Page Copy text boxes?

5) How to add a Favicon?

I've really tried to find the answers on my own, so I'll be very grateful for your continued help. Thank you!

John

Last edited by johnblaustein (2018-02-11 05:34:56)

rod barbee · 2018-02-11 05:43:12

1) How to remove the copyright notice from the footer, other than make the text color match the background color (which is what I've done)? Deleting the copyright text from the Footer section of Page Design does not remove it.

One option is to completely disable it. In Footer, turn Bottom Pallet/Copyright off.
Another option is to hide it with custom css.

2) On my iPhone, my site logo is centered, not right justified. Why? Do I need to use a smaller image file in Secondary Masthead section?

You might try a smaller image in the Secondary Masthead. It looks to me that the masthead is still right-aligned, it's just that the image is large enough to take up nearly all of the available space. There is 48px of left and right padding built in. You can control this in the Template settings under Masthead > Secondary Masthead

3) The "About" page is 3 columns, and displays oddly on the iPhone and iPad--two hamburger menu buttons to show the side columns. On this page, the menu changes from right to left side. I'm OK with the two side panels needing the menu button to display, but can the menu stay under the right menu button as it does on all 1-column pages?

You can assign the menu to pallet 1 or pallet 2. Under Navigation > Vertical Navigation.

When entering text, how to enter a list? Carriage returns are being ignored. How to add extra spaces between lines.

either use html or Markdown. More on Markdown on this page: http://backlight.theturninggate.net/doc … iting-copy
The reason your photo is not displaying is because of the double quote marks: they're curly or slanted. Either type directly into the copy field or first type your copy in a plain text editor and paste.
To fix this, go into the copy field, delete the existing quote marks and re-type them. Do this for all quote marks you have in that code.

On the subject of embedding, to add a PayPal button, do I simple paste the HTML from PayPal's site into one of the Page Copy text boxes?

that should work. You may want to give it a class for further styling.

5) Is there a way to hide the arrows on the mobile version of the Galleria slideshow? Since the mobile version is swipe-able, the arrows aren't needed.

I don't recall. I think that during testing there were some issues popping up surrounding that having to do with hybrid screens (laptop that are also touch screens).
You may need custom css to remove those.

I see on the TTG demo page for Galleria that the arrow background is clear, so only the white arrow displays on the photo in mobile mode. How do I get the arrow background clear?

In your Galleria template: Photo Presentation > Arrows Background. Set the transparency slider to 0 in the color picker.

6) How to add a Favicon?

Upload a favicon using the Uploader. In Backlight, hover over Designer > Templates. Click on Uploaded Images. Then click on Upload New Image
Back in your Page Template, go to Advanced Setup. At the bottom of the page you'll find controls for displaying Favicons as well as Apple Touch Icons.

johnblaustein · 2018-02-11 06:15:12

Thanks for the quick reply.

1) I want the footer because it adds a margin, just not the copyright text. I will leave the text color set to the background color and then it is invisible.

2) Logo: I will try a smaller image.

3) Mobile menu: I will set the vertical menu items. The quotation marks fixed the photo! For text formatting, I have Dreamweaver and can create the HTML there. Or I'll download that Markdown app.

5) After posting my question about the arrows, I figured out how to set that transparency to 0. I can live with the small white arrows.

6) Favicon.... got it.

THANK YOU!

John

rod barbee · 2018-02-11 07:42:34

I want the footer because it adds a margin, just not the copyright text. I will leave the text color set to the background color and then it is invisible.

In the Footer, you could try turning the Bottom pallet/Copyright off and then increase Margin-top.

johnblaustein · 2018-02-11 10:48:32

Yes, I can see that using the Margin-top (and Border-top/bottom too?) will keep the page contents away from the bottom of the browser window. With Pallet/Copyright off, however, Backlight's auto-refresh button doesn't display, and that's very handy! <g> Since setting the copyright text color to match the page background color is working to hide the text, I will leave that for now.

By the way, I solved my "arrow issue" on the Home page by making the arrow color match the page color. No arrows, but not needed with auto-play. (I tried Theater on the home page with no luck. Galleria is just right.)

Still much to work out, but I'm having fun and it is all SO much easier than my previous experiences with Microsoft FrontPage, Dreamweaver and Muse.

John

Last edited by johnblaustein (2018-02-11 10:48:54)

Matthew · 2018-02-12 17:17:47

The reason for the arrows on Galleria is, in fact, that we were having issues with hybrid devices. In short, there's no reliable way of discerning where or not a touch-screen also has mouse support. So when we disappeared the arrows on touch-screens -- a questionable practice in any case -- then we left mouse users on hybrid devices in a lurch without arrows. In the end, the best solution was determined to be NOT hiding them at all.

I have provided dedicated color controls for the arrows, separate from other UI elements, intending that white arrows with a drop-shadow and transparent backing are probably the ideal thing to use, regardless of other settings. This allows the arrows to remain unobtrusive, even when overlaying an image.

For auto-refresh, you can writein "?autoRefresh" at the end of the page address in the URL bar to activate it. So if you disappear the footer, just do that to activate the feature.

I'm glad to hear you're otherwise getting along well with Backight.

johnblaustein · 2018-02-13 01:18:38

Hi Matt,

Thanks for your comments.

I understand the "arrow issue." I see the need for them, and your color controls offer ample choices to make them very usable for all users.

"?autoRefresh" -- got it! I'm keeping the footer just to separate all page content from the bottom of the browser. It looks more elegant to me.

I've downloaded MarkdownPad2 and it's working well on the text. For example:
http://bklight.johnblaustein.com/about-the-book/

I can't figure out how to center the image, but I'll work on that. I also need to address gallery controls when viewing on my iPhone 6s--they slightly overlap the image. It's not bad, but I'd prefer a couple of pixels between the controls and the image

I am loving Backlight! When you consider that I installed it on Friday and that my new site is almost complete three days later, that says a lot about "ease of use." Without your and Rod's help, however, I wouldn't be this far along.

I am of course aware of the BL DOC file--http://backlight.theturninggate.net/docs/doku.php. It would be very helpful for a more detailed document that describes every single setting and slider! I know that's a lot of work on your part, but it would eliminate a lot of questions.

Best,

John

rod barbee · 2018-02-13 01:31:51

I can't figure out how to center the image, but I'll work on that.

use html.
at the minimum:

<img class="aligncenter" src="http://yoursite.com/path-to-image/image.jpg" >

if you want to add a caption:

<div><figure><img class="aligncenter" src="http://yoursite.com/path-to-image/image.jpg" ><figcaption  style="text-align: center;">Caption for image</figcaption></figure></div>

rod barbee · 2018-02-13 01:36:39

I also need to address gallery controls when viewing on my iPhone 6s--they slightly overlap the image.

try setting the Galleria controls to "Outside"

johnblaustein · 2018-02-13 03:44:28

Rod....

UGH! It's all so easy..... you just need to know how to do it.

Image now centered. Galleria now set Outside. All working perfectly.

MarkdownPad2 is very cool. I'm creating the text there and simply using the Edit > Copy Document as HTML and pasting into BL. So easy. I had a bit of trouble figuring out how to insert line feeds, but Google answered that--two or more spaces at the end of the line, then press Enter.

I think I now have all the tools I need to finish up the site. I'll take advantage of your online instructions for including inline images for my About page so that I don't have to use a 3-column layout. I'm not wild about how that works on mobile with the pallets (but that's just personal preference).

I have to tell you, I've been looking at Backlight for a long time, and I was concerned that it would not offer enough design flexibility. Now that I'm using it, I find it to be truly remarkable.

If I may repeat myself..... THANK YOU!

John

Community @ The Turning Gate

#1 2018-02-06 15:03:56

Migrating from MUSE to BACKLIGHT - advice needed

#2 2018-02-06 15:38:03

Re: Migrating from MUSE to BACKLIGHT - advice needed

#3 2018-02-07 02:25:11

Re: Migrating from MUSE to BACKLIGHT - advice needed

#4 2018-02-10 01:20:35

Re: Migrating from MUSE to BACKLIGHT - advice needed

#5 2018-02-10 01:39:16

Re: Migrating from MUSE to BACKLIGHT - advice needed

#6 2018-02-10 03:49:40

Re: Migrating from MUSE to BACKLIGHT - advice needed

#7 2018-02-10 04:28:05

Re: Migrating from MUSE to BACKLIGHT - advice needed

#8 2018-02-10 05:19:04

Re: Migrating from MUSE to BACKLIGHT - advice needed

#9 2018-02-10 05:42:40

Re: Migrating from MUSE to BACKLIGHT - advice needed

#10 2018-02-10 05:57:12

Re: Migrating from MUSE to BACKLIGHT - advice needed

#11 2018-02-10 07:15:02

Re: Migrating from MUSE to BACKLIGHT - advice needed

#12 2018-02-10 07:37:46

Re: Migrating from MUSE to BACKLIGHT - advice needed

#13 2018-02-10 08:05:31

Re: Migrating from MUSE to BACKLIGHT - advice needed

#14 2018-02-10 08:24:44

Re: Migrating from MUSE to BACKLIGHT - advice needed

#15 2018-02-10 08:33:09

Re: Migrating from MUSE to BACKLIGHT - advice needed

#16 2018-02-11 03:57:49

Re: Migrating from MUSE to BACKLIGHT - advice needed

#17 2018-02-11 05:43:12

Re: Migrating from MUSE to BACKLIGHT - advice needed

#18 2018-02-11 06:15:12

Re: Migrating from MUSE to BACKLIGHT - advice needed

#19 2018-02-11 07:42:34

Re: Migrating from MUSE to BACKLIGHT - advice needed

#20 2018-02-11 10:48:32

Re: Migrating from MUSE to BACKLIGHT - advice needed

#21 2018-02-12 17:17:47

Re: Migrating from MUSE to BACKLIGHT - advice needed

#22 2018-02-13 01:18:38

Re: Migrating from MUSE to BACKLIGHT - advice needed

#23 2018-02-13 01:31:51

Re: Migrating from MUSE to BACKLIGHT - advice needed

#24 2018-02-13 01:36:39

Re: Migrating from MUSE to BACKLIGHT - advice needed

#25 2018-02-13 03:44:28

Re: Migrating from MUSE to BACKLIGHT - advice needed

Board footer