Multiple pages open at a time?

Am wondering if it's possible to open more than one page at a time so I don't have to keep swapping between them. The swapping works, but would be simpler if I could keep a base page open that I've edited a lot of things on so I can copy things over to the other page(s) as needed. Using the User Components Library for this doesn't quite do what I need as some of them are just edits to a class or adding a new class or removing it from some of the elements. Thanks!

Thank you for opening this thread! One quick way to send elements from one page to another is with the Copy To menu, which is shown when you right click on a component. With it you can quickly send elements from one page to another without having to switch between them.

Having multiple pages open at a time would be a great feature to have. It would also be very complex. We will work on this eventually, but right now there are things with higher priority that we need to add to Bootstrap Studio.

Yeah I understand on sending full elements and library components being very useful to get complete items to another page and that is all helpful. The issue here though is just edits "to" the elements that are already there (basically because we don't have a DW type Library system or a way to create template type things that all pages share that I'm aware of). So the issue would be that maybe I have the same element on all the pages, but.... I am editing the class name or adding/removing a class or ID to the already existing elements. Can't send that over really so the code needs to be copied and pasted.

As long as we know that multiple pages open is something in the future though, I can tough it out haha. I'm very glad to know it is something being considered at a later date though and I fully understand getting more of the immediate features in first. Thanks!

@jo,

Your latest post sounds like your describing the Linked Component function that was added a few updates ago.

The concept of template sections of code is what the linked components is. If your not familiar with it, here's a run down. I just used it a lot yesterday because I didn't think to use it sooner.

If there is a section of code you want on each page and you want to edit once on a page but have it update that same section of code through out all of that project, then in the Overview pane right click and select "Copy" of the code. Double click on another page in the Design pane and in it's Overview pane where you want that copied section the be, right click and select Paste Linked. Your copied code with be there and it will have a chain link at the end signifying linked code. You will have to do this to each page of that project. There isn't a way that I know of that you can just tell a common item per page to be linked you have to copy over code to be linked. The code doesn't seem to be copy/paste able between projects you'll have to create a new linking for that other project.

You have to be careful on a page to not delete the linked code because the link on the page breaks and Undo while it will restore the code it does not restore the linking. You'd have to copy/paste from another page that linked code to restore the linking on that page.

I had to copy a section of code to ~60 pages to link them because I didn't do it before I got that many pages. :D

Now though I duplicate a page and modify the content section and this keeps my linked components throughout.

Also just noticed that on a linked code if I edit it all the pages update but if I go to a different page I can't Undo that change I have to go back to the page I made that change on and Undo from there and then all that linked code updates again.

Saj

I will take a look at that tomorrow and see if I can work out how that works. I may need to get more information on it, but I will post back if that's the case. Thanks so much for all your help Saj.

There seems to be a lot of information about this app that is not covered in the basic instructions that I found. Is there more detailed information somewhere else that can be read? It would sure save a lot of time and questions if there is.

Ok I am obviously not doing something right here. So let me tell you the steps I am taking. I have a page with a full Header, Sidebar and Footer that I want to use on all pages and do this "linked paste" to all the pages from a page that I will keep as my template holder page. From here I'm doing the following:

  1. In the left side in the Overview dropdown I am expanding it to my Header section and highlighting the Header section completely.
  2. I right click over that highlighted Header line and choose "Copy" from the menu.
  3. I then open another page that I have already got this section in, but am hoping I can overwrite it with this copied section.
  4. I expand the Overview tree to see the Header area and I highlight that complete Header section.
  5. I right click over that highlighted Header line and ...

There is no paste option there at all. I've tried checking the top system menu of the app and choosing "Edit" and looking in the dropdown there for the "Paste Linked" there, but only a "Paste" is on that menu, no "Paste Linked" or anything similar for it.

Am I missing a step somewhere or doing something incorrectly?

4 and 5 can't be done like that. You have to delete the old header section so you can paste in the new linked one.

Try this to get a little more familiar with the process.

  1. highlight the header section in the Overview pane
  2. right click and select Copy
  3. In the Design pane right click on Pages and select Create Page
  4. double click on untitled.html
  5. In the Overview pane of that page right click on Body and select Paste Linked

That should work for you so you can see what happens.

Once you get familiar with that then try again on your normal pages. You will need to right click on the parent element that contains your Header so in effect you will have 2 header elements, then you can delete the old one. You will need to do that same thing on all current pages of that project that you want to have linked components on. Then for new pages just duplicate an existing page and strip out the uncommon content sections and maybe rename it to component_template.html to use as a new page starting template.

Saj

P.S. don't worry, it took me a bit to wrap my head around it to at first too.

Thanks again, but I went through the steps as I understood them (which isn't always right haha), and there is still no Paste Linked on the right click menu, no paste at all shows up. I've done a video so you can see exactly what I did and hopefully that will help narrow down what I'm doing wrong or if something else is wrong. Thanks for your help on this.

http://content.screencast.com/media/a41ff47e-1300-44c5-b53a-18010ff901ec_a22c8ba7-73ea-4a4d-905e-0edabc9713fb_static_0_0_2016-06-23_13-37-56.mp4

I see what your saying (showing hehe :) )

I'd have to say that's a bug then. Unless there's something different for a Mac which I don't think is the case. And it looks like your have the latest version.

I think @martin is going to have to step in on this one then :) sorry I couldn't be anymore help.

Saj

No problem at all, I appreciate any help you offer at any time so thanks for trying, and bugs are ok when they show me it's not me that's messing up hahaha. I'll wait for Martin to check on this for me and in the end it will be awesome to have this feature working and put me one step closer to an easier design system.

Any luck with this Paste Linked setup for Mac Martin?

The instructions by @saj are correct, and it works when I try it on OS X. A few questions:

  1. Does copy and paste work anywhere in the app?
  2. Do you have some clipboard manager or something else running that empties your clipboard?
  3. Does the same issue happen when you edit other .bsdesign files?

Copy and Paste works well in the HTML Custom Code boxes, adding and removing from the classes and ID's, but is quirky in the CSS in that you must copy it by highlighting the code in the Styles window of whatever CSS file you're editing, and then choose Edit > Copy from the top menu of the App. You can paste using the Ctrl+V keys most of the time without issue as long as any internal CSS code was copied via the Menu. If you try copying via Ctrl+C in any of the Styles windows it does nothing.

I "do" have the app CopyLess running on my computer for being able to manage my copy and paste. It does empty my clipboard at log off (well is supposed to, but doesn't always lol).

The Paste Linked is the same for me ( not there ) in all designs. I've tried to create new ones, use one of the default templates that comes with the app, and copying my own designs and renaming them. Same thing no matter what, there is no Paste Linked option anywhere at all.

I am on OS El Capitan if that makes any difference also.

Can you try again after stopping CopyLess?

PASTE LINKED IS NOW THERE! I turned off CopyLess and now the Paste Linked and a few others too, show up in the right click menu when I click an block in the Overview area. YAAAAAYYYY .....

But ..... It's not copying CSS with the ctrl+c keycombo, I still have to use the apps system menu to do that. I did narrow something else down though that I didn't notice before. Could be that the things I was testing with before didn't have a lot of text in them, OR I had already copied these areas and I may have thought it was just trying to paste something I had previously copied. Today I had not copied anything at all yet, so I was able to see that it's doing something (or not doing something lol) different.

Here's what it does do if that helps, because it actually is copying something with the ctrl+v, it's just not what I highlight in the CSS file, it's copying whatever I have selected in the HTML file and pasting that when I use ctrl+v.

For Example:

  1. I have a column selected that has an H3, H4 an image and some paragraphs in it. That's what I selected in the visual preview in order to bring up some CSS in the Styles pane.

  2. I find a section of CSS that isn't editable and I use ctrl+c to attempt to copy it.

  3. I open my custom CSS page and go to the end of the file and click at the bottom to initiate a class.

  4. I hit ctrl+v to paste what I copied from the Styles pane, and instead of pasting what I was attempting to copy from the Styles pane, it pastes all the text from the HTML Column. All of it, both of the H3 texts, and the paragraphs. No tags, no image tags or anything about the image, just all the text from the whole column's content.

It's like the app isn't recognizing that I'm highlighting something in the CSS file. This works fine if I use the apps system menu and go to Edit > Copy, then it copies the correct content.

I'll play with the CopyLess app and see if setting BSS to be ignored in it works and if not I just won't use it when I'm working on websites. I used it a lot with Dreamweaver, because it made it easier to remember multiple sections to go to other pages etc. But I don't think I'll need it in BSS so that's ok. I'm just glad to see the Paste Linked there now! Thanks for having a clue what it might be!

Great to hear it worked. Most likely CopyLess is stripping the meta data from the copied text, which Bootstrap Studio uses to track which component was copied.

The problem with copying CSS is a separate bug that was fixed last week and will be part of the upcoming release.

Oh Yaaaaaaaaaay then it wasn't just me that had that issue?! Glad to hear it! Not that I want anyone else to be plagued with things I'm plagued with, but I'm always glad to know I'm not the only one. Thanks again!

@Saj, you should post this instruction above in the Tips & Tricks area, it helped me a lot and I can't thank you enough for it and for having it work now thanks to Martin's suggestion to turn off the CopyLess, you can feel free to add that to the your tutorial as well so that others that have an issue with it will know to turn off any copy/paste managing apps too.