Welcome to TalkGraphics.com
Page 1 of 2 12 LastLast
Results 1 to 10 of 12
  1. #1
    Join Date
    Dec 2014
    Location
    Thailand
    Posts
    97

    Default Modifying a NavBar button to display two lines of text

    Is it straightforward to alter a navbar so it could accommodate two lines of text per button?

    I've done what I thought was the obvious, like adding <br> in the text, (as I've done with other programs), but the button text doesn't recognise it.

    Would I have to disassemble a button and modify it, then reassemble afterwards, for example? I'm quite reluctant to do this as I'm still struggling to use some of the features.
    Or is there an easier way?

    I have a website at present that I want to re-design with WD11, it's an Xsite Pro website. In XSP I could put a second line of text in the buttons – you can see here: http://megalithmovers.org/

  2. #2

    Default Re: Modifying a NavBar button to display two lines of text

    Quote Originally Posted by Mac Hine View Post
    I've done what I thought was the obvious, like adding <br> in the text, (as I've done with other programs), but the button text doesn't recognise it.
    No, because Web Designer is not a HTML editor

    Quote Originally Posted by Mac Hine View Post
    Would I have to disassemble a button and modify it, then reassemble afterwards, for example? I'm quite reluctant to do this as I'm still struggling to use some of the features.
    Or is there an easier way?
    You'd be best advised to create you own navbar from scratch.
    http://www.xaraxone.com/webxealot/wo...orkbook_3.html

  3. #3
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    18,474

    Default Re: Modifying a NavBar button to display two lines of text

    As I don't have your specific Navbar handy, it is possible to Ungroup the elements by double-clicking it and then clicking the Ungroup to edit graphics button.
    Each button will be grouped so you need to ungroup each in the same fashion and then manipulate the text. There are a lot of steps and nuances to getting this right so I wouldn't even try.

    Your example isn't really a Xara-style NavBar, it is a collection of text links on a graphic. It doesn't have sub-menus.

    In this case, all you need to is create a number of text boxes of the correct depth. Add text.
    Clone and colour the text to the rollover colour and place on the MouseOver layer. Soft-group with the original text and add the link.
    Repeat for all links align and place on top of your link bar graphic.

    acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  4. #4
    Join Date
    Dec 2014
    Location
    Thailand
    Posts
    97

    Default Re: Modifying a NavBar button to display two lines of text

    Quote Originally Posted by Acorn View Post
    As I don't have your specific Navbar handy, it is possible to Ungroup the elements by double-clicking it and then clicking the Ungroup to edit graphics button.
    Each button will be grouped so you need to ungroup each in the same fashion and then manipulate the text. There are a lot of steps and nuances to getting this right so I wouldn't even try.

    Your example isn't really a Xara-style NavBar, it is a collection of text links on a graphic. It doesn't have sub-menus.

    In this case, all you need to is create a number of text boxes of the correct depth. Add text.
    Clone and colour the text to the rollover colour and place on the MouseOver layer. Soft-group with the original text and add the link.
    Repeat for all links align and place on top of your link bar graphic.

    acorn

    OK, it sounds like trying to edit an existing navbar wouldn't be a straightforward option.

    The existing website as you said, looks like text links on a graphic. However, it does have three levels of sub-menu – if you hover over “Blog Pages” you'll see.

    I think that once I get the hang of the navbar system it'll will probably be OK. It's just getting over that learning curve.

  5. #5
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    18,474

    Default Re: Modifying a NavBar button to display two lines of text

    Sorry, I did miss the Blog sub-menu.
    As steve.ledger mentioned, building your own is relatively simple.
    Unfortunately, you'll need to add in all the links from scratch.

    You could create a number of layers and roll your own for your Blogs detail.
    Personally, I would create a large pop-up with all of the blog links visible and selectable just be making a text box with two levels of bulleted text.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  6. #6
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    22,098

    Default Re: Modifying a NavBar button to display two lines of text

    Try going through this xar file. It has a two line text buttons. You'll need to preview. I agree with Steve, creating your own navbar isn't difficult, but pre-plan.
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	2-line-navbar.png 
Views:	185 
Size:	4.3 KB 
ID:	108100  
    Attached Files Attached Files
    Egg

    Minis Forum UM780XTX AMD Ryzen7 7840HS with AMD Radeon 780M Graphics + 32 GB Ram + MSI Optix Mag321 Curv monitor
    + 1Tb SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  7. #7
    Join Date
    Feb 2014
    Location
    Toronto, Canada
    Posts
    795

    Default Re: Modifying a NavBar button to display two lines of text

    Hi Mac Hine, assuming you are using wd11P then click on your navbar,then click the text tool on the left of the screen, put your cursor on the text , move it to the last letter and click enter, you can then add the second line and voila, 2 lines. Do not know about WD11 but I remember it working in WD10P

    Ciao

    Roly

  8. #8
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    22,098

    Default Re: Modifying a NavBar button to display two lines of text

    Hi Roly,

    The problem with that is whilst the text takes on a second line, the graphic behind the text remains the same size. Or am I having another senior moment?
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	2-line-navbar-overflow.png 
Views:	177 
Size:	3.1 KB 
ID:	108109  
    Egg

    Minis Forum UM780XTX AMD Ryzen7 7840HS with AMD Radeon 780M Graphics + 32 GB Ram + MSI Optix Mag321 Curv monitor
    + 1Tb SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  9. #9
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,653

    Default Re: Modifying a NavBar button to display two lines of text

    I tried the same thing with exactly the same results Egg.

  10. #10
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    22,098

    Default Re: Modifying a NavBar button to display two lines of text

    Cheers Gary. That is why I said that planning ahead is important, and if you consider you're going to require 2 lines of button text the background graphic needs to accomodate the second line (or 3rd or 4th lines if that's going to be a requirement)
    Egg

    Minis Forum UM780XTX AMD Ryzen7 7840HS with AMD Radeon 780M Graphics + 32 GB Ram + MSI Optix Mag321 Curv monitor
    + 1Tb SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •