Skip to Content Skip to Menu

🎃 Happy Halloween! Treat yourself with an awesome discount! Get 20% off now with code SPOOKY-2024!

Simple Layout question

8 years 1 week ago #287034 by Paladin Brewer
Simple Layout question was created by Paladin Brewer
Hey guys,

Sorry I'm new here, so I'm sure this is a dumb question. I looked through your manual but I'm still having problems figuring how how to move things around in a basic layout. So here is a screenshot of the profile I am working on:




Now want I want is for the "Main Character" section to be where is is, but then the "Alts" header starts a new section next to in the middle, not under it. I'm not sure how I do that. I tried making a new "Alts" tab, but I can't see how to get it to appear on that tab and only that tab, and in the correct place. Basically I want it to look kind of like this:



And since you have to look at those horrible screenshots anyway, for the "Main Character" and "Alts" Header I made a new custom html field with no title and h3 css class, is that how we're supposed to make headers on this :)

Thanks guys!

Please Log in or Create an account to join the conversation.

  • krileon
  • krileon
  • ONLINE
  • Posts: 48454
  • Thanks: 8280
  • Karma: 1443
8 years 1 week ago #287060 by krileon
Replied by krileon on topic Simple Layout question
You'd need to write custom CSS to make those fields be side by side. Probably the easiest solution is to make 2 tabs, place them in not shown on profile positions then under Character Info tab use a Custom HTML field and tab substitutions to substitute in those 2 tabs to be side by side. Example as follows for your Custom HTML field.

Code:
<div class="row"> <div class="col-sm-6">[cb:usertab tab="TAB_1_ID_HERE" /]</div> <div class="col-sm-6">[cb:usertab tab="TAB_2_ID_HERE" /]</div> </div>

The ID of a tab can be found under the far right ID column in CB > Tab Management. See the below for further substitution usage information.

www.joomlapolis.com/documentation/279-community-builder/tutorials/18353-using-substitutions-throughout-cb


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.

Please Log in or Create an account to join the conversation.

8 years 1 week ago #287093 by Paladin Brewer
Replied by Paladin Brewer on topic Simple Layout question
Hello,

So I tried this out, and besides the obvious need to make my own CSS class (which honestly will probably work out better for me in the end), I have some other issues here:

1) How do I get rid of the Char Fields label? (this is the field I put your custom html code in). I tried 1 line no label, but then it indents it in and I don't want that.

2) The data is now on 1 line, and with no labels?

3) Why the evil side scroll bar? :)

Please Log in or Create an account to join the conversation.

  • krileon
  • krileon
  • ONLINE
  • Posts: 48454
  • Thanks: 8280
  • Karma: 1443
8 years 1 week ago - 8 years 1 week ago #287113 by krileon
Replied by krileon on topic Simple Layout question

1) How do I get rid of the Char Fields label? (this is the field I put your custom html code in). I tried 1 line no label, but then it indents it in and I don't want that.

Yes, set the Custom HTML fields "Show on Profile" parameter to "Yes, 1 Line without Title".

2) The data is now on 1 line, and with no labels?

The below should work (confirmed locally).

Code:
<div class="row"> <div class="col-sm-6">[cb:usertab tab="TAB_1_ID_HERE" formatting="divs" /]</div> <div class="col-sm-6">[cb:usertab tab="TAB_2_ID_HERE" formatting="divs" /]</div> </div>

3) Why the evil side scroll bar?

That appears to be styling coming from your Joomla template. Switch to default protostar template and see if issue persists. Was unable to confirm such an issue when testing locally.


Kyle (Krileon)
Community Builder Team Member
Before posting on forums: Read FAQ thoroughly + Read our Documentation + Search the forums
CB links: Documentation - Localization - CB Quickstart - CB Paid Subscriptions - Add-Ons - Forge
--
If you are a Professional, Developer, or CB Paid Subscriptions subscriber and have a support issue please always post in your respective support forums for best results!
--
If I've missed your support post with a delay of 3 days or greater and are a Professional, Developer, or CBSubs subscriber please send me a private message with your thread and will reply when possible!
--
Please note I am available Monday - Friday from 8:00 AM CST to 4:00 PM CST. I am away on weekends (Saturday and Sunday) and if I've missed your post on or before a weekend after business hours please wait for the next following business day (Monday) and will get to your issue as soon as possible, thank you.
--
My role here is to provide guidance and assistance. I cannot provide custom code for each custom requirement. Please do not inquire me about custom development.
Last edit: 8 years 1 week ago by krileon.

Please Log in or Create an account to join the conversation.

8 years 1 week ago #287129 by Paladin Brewer
Replied by Paladin Brewer on topic Simple Layout question

1) How do I get rid of the Char Fields label? (this is the field I put your custom html code in). I tried 1 line no label, but then it indents it in and I don't want that.
Yes, set the Custom HTML fields "Show on Profile" parameter to "Yes, 1 Line without Title".


Ah sorry about that, for some reason I didn't see there was a "with Empty title" and a "without title". Much better :)

2) The data is now on 1 line, and with no labels?
The below should work (confirmed locally).

<div class="row">
<div class="col-sm-6">[cb:usertab tab="TAB_1_ID_HERE" formatting="divs" /]</div>
<div class="col-sm-6">[cb:usertab tab="TAB_2_ID_HERE" formatting="divs" /]</div>
</div>


That worked, thanks much. Time to figure more of this out :)
The following user(s) said Thank You: krileon

Please Log in or Create an account to join the conversation.

Moderators: beatnantkrileon
Powered by Kunena Forum