Jump to content


Photo
Tabber

Tabber - a few speed bumps



Best Answer tem_web8393 , 07 March 2013 - 04:57 PM

OK, thanks...

Go to the full post


  • Please log in to reply
22 replies to this topic

#1 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 05 March 2013 - 03:29 PM

I'm building out the pages and tabs.  Here is where it is so far:  http://convergentsg.com/?page_id=74

 

1) Is there a way to get the tabs left justified on the page rather than sitting mid-way under the main navbar?  I selected "left" which has resulted in a vertical menu, but it just doesn't sit to the left of the page.

 

2) On my second tab, I have a numbered list in the text.  On the page holding that content, those numbers are indented, but when Tabber displays them, they are actually pushed left which looks bad.  Is there something I can do to fix that?

 

3) The color and bold font don't work well with the design I'm building.  Is there a way to make it appear more subtle?

 

Here's an example of what I'm trying to do.   http://www.aspectmar...e.com/services/

 

Thanks!



#2 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 05 March 2013 - 08:36 PM

Just a note - since there hasn't been a reply yet, I took the numbered list referenced in 2) above out and just have blocks of text.  I would like to put the numbered list back in when it can mirror the indented format of the page from which it draws the content.

 

Looking forward to some insights!  Thanks!



#3 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 06 March 2013 - 02:51 PM

Hey there,

Nicely done! Really impressed with what you did with that. Tabber should retain all formatting when brought in from a page content. Are you filling in a numbered list using the option or a page id?



#4 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 03:31 PM

The numbered list is just in the "edit" box (the content that is in the Post Loop section).  It was just a paragraph with some numbered bullets underneath like this:

  1. Example 1
  2. Example 2.

Instead of bringing those back indented like above, Tabber actually had them "outdented" further to the left than the main block of text.

 

Also, can you please let me know about 1) and 3) in my original question?  I really want the tabs on the left of the page rather than in the middle.  And for color/font - I was curious if it would be easy for you to just provide a box where we can put the 6 digit value for color for the tab background like you do for # of boxes, layout, etc.  Similar thing for entering code for font type and color.

 

Anyway, I do need to get the tabs to the left, get a numbered list to come over formatted as it is on the page it draws from, and get colors and fonts that work with my page.  Thanks!!



#5 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 04:02 PM

It just occurred to me that you might have looked at the link in my original question (at the bottom) that was the example of what I wanted to achieve, rather than the link (near the top) that shows you where I am now.  

 

One of the three items asks to get the column of tabs left justified on the page, like the screenshot examples you provide to prospective customers.

 

I really need support for the three items in my original question.  Thanks!



#6 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 06 March 2013 - 05:14 PM

Hi,

"1) Is there a way to get the tabs left justified on the page rather than sitting mid-way under the main navbar?  I selected "left" which has resulted in a vertical menu, but it just doesn't sit to the left of the page."

 

There's an option to adjust the width of Tabber. You have 840px, which is why there's a space on the left.

http://screencast.com/t/e6RJ6VPw

 

"2) On my second tab, I have a numbered list in the text.  On the page holding that content, those numbers are indented, but when Tabber displays them, they are actually pushed left which looks bad.  Is there something I can do to fix that?

Like I asked above, are you using a page id to stream in the content, or the text box? When streaming in from a page it should retain all the formatting.

 

 

"3) The color and bold font don't work well with the design I'm building.  Is there a way to make it appear more subtle?"

Sure you can use some CSS to achieve whatever look you're going for.



#7 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 05:23 PM

On 1) do you have a suggested width to enter to make the tabs align on the left of the page?  I just want it to look like your screen shot.

 

On 2), I'm using a page ID to bring in the text, as with all the tabs.  That's how it seems the section works and I'm not aware of how else to do it.  Is there some other way that will make it retain the formatting of the page from which it's drawing?

 

On 3) What's the easiest way you'd suggest to get into custom CSS?  I've seen you mention providing color choices on your other products.  Are you going to integrate that advancement into this product?

 

Thanks!



#8 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 06 March 2013 - 05:40 PM

1. Sure, simply remove the 840 that you have in the option field and it will go to 100%.

http://screencast.com/t/pX0u703F7g

 

2. I visited your link but don't see the numbered list bug that you're mentioning. The content has filters applied so all formatting should be retained. If you have a link with this bug I'd be happy to investigate.

 

3. Yup I recommend going through these courses at CodeAcademy. At some point it's possible I'll include a color picker. http://www.codecadem...com/tracks/web 



#9 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 05:46 PM

Thanks.

 

1.  I never put 840 in that field.  I must have just defaulted to that for some reason.  I had not entered a value in the box when you looked at it and found 840 in the code.  At this point, I have it all the way to 1200, and it is now close to the left, but still will not get all the way there.  After about 1140 it stopped moving left.

 

2.  I took the numbered list out because it looked bad.  I will put it back now so you can see.  It's under the "analyze strategic issues" tab.

 

3.  Thanks - I'll have to learn how to code CSS to tweak other things anyway...



#10 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 07:47 PM

Really would like support on 1 and 2 above.  

 

Again, on 1 you seem to think I put a value of 840 in the option field, and I did not.  It was blank.  I cannot right now see any way to get the tabs to align on the left of the page like in the screenshot you use to sell the program.

 

On 2, I put the list back in.  Go to the tab "Analyze strategic issues".  I use the page ID like with every other tab.  On the page where the text resides, the numbers are indented.  Tabber takes in the content but actually "outdents" or pushes the list left.  Doesn't look good.

 

Thanks!



#11 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 06 March 2013 - 11:42 PM

If you do not enter a value, it will stretch to 100% the width of it's parent container.

 

"I cannot right now see any way to get the tabs to align on the left of the page like in the screenshot you use to sell the program."

There is no special code or treatments at all on the demo. The value is left blank, and it's stretching to fil the parent container. Yours is too.

 

http://screencast.com/t/Odz8h4Ba

 

What you're seeing is pagelines main column padding. This is outside the scope of the sections style.

 

Regarding the "outdenting" again if you have a link I would love to investigate and possibly provide a fix. However I'm unable to provide the proper help without seeing what's going on.



#12 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 11:51 PM

Thanks

 

I'll provide a link again:  http://convergentsg.com/?page_id=74

 

You can see both issues there.  And again the tab is the second tab - "analyze strategic issues" which shows the issue.  The page that the text is from has the numbers indented, but that's not how it shows up under Tabber - they are actually pushed left of the main text they're under.

 

And I'm sorry, but the left justifying of the column of tabs does not work how you say.  I did not enter a value - that field was blank, and the column of tabs was near the middle of the page.  All I want is for the column of tabs to be left justified on the page.  Is there a way to do this?

 

I currently have a value of 1200 in there which pushed the column to the left, but not all the way.  Again, when the field was blank, the column sat more in the middle of the page.  Those are just the facts of my experience.  



#13 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 06 March 2013 - 11:53 PM

Also, the content area of the Template for that page has just Tabber - there is no sidebar or anything else taking up space.



#14 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 07 March 2013 - 12:21 AM

I put the field back to blank so you can see how the column of tabs sits more in the middle of the page with no value in that box.



#15 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 07 March 2013 - 02:24 AM

Try putting this in your Custom CSS

.tabbable {max-width:100% !important;}



#16 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 07 March 2013 - 02:54 AM

Thank you!  OK, that moved it almost all the way to the left.  On other pages, the content starts about there.  I have some boxes on my home page that justify all the way to the left, but this may be as far to the left as the content section goes.

 

I don't know if I can put Tabber outside the Content Area and just directly into the Page Template.  I tried that before but it didn't work.  If that's as far left as it can go, it's pretty close and should work.

 

FYI - this is essentially the same effect as when I put values like 1180 and 1200 in that field.  However now it's there with the field blank.

 

 

By the way, on the issue of the numbered list - the page for which I gave you the link is drawing from page ID 104 (that's the page that the tab "analyze strategic issues" draws from.  

 

Thanks for digging in!!



#17 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 07 March 2013 - 02:11 PM

Hmm not entirely sure why those numbers padding are off. Try putting this style in your OL markup.

 

<ol style=" padding-left: 20px;">



#18 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 07 March 2013 - 03:30 PM

Thank you.

 

OK, that's better - thanks.  It still does not indent the list, but the numbers are at least lined up under the paragraph above and do not stick out to the left.  I wonder if I can get it to indent by trying more than 20px?



#19 tem_web8393

tem_web8393

    Member

  • Members
  • 17 posts
  • Country: Country Flag

Posted 07 March 2013 - 03:56 PM

So it worked - the value of 20 lined the numbers up directly under the text above.  35 indented the numbered list.  Very nice - perfect.  I'd say that's resolved.  Thank you!

 

Also I found the CSS that was set at 80% for the right margin and put it at 65% which created a bit of a right border so the text associated with the tab didn't stretch across the entire page to the right.  Looks better.



#20 beardedavenger

beardedavenger

    Unicorn Wrangler

  • Members

  • 1219 posts
  • Country: Country Flag

Posted 07 March 2013 - 03:57 PM

Great to hear. Go ahead and click that Mark Solved button if your satisfied with the responses. If there's anything else I can do please let me know.







Also tagged with one or more of these keywords: Tabber