Skip to Content Skip to Menu

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

Bootstrap Template and Column Width

11 years 2 months ago #232693 by edmundcheong
Bootstrap Template and Column Width was created by edmundcheong
I somehow find some problem configuring the 2 and 3 column layouts widths on the bootstrap template.

somehow the width is fixed on the bootstrap template.

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

  • krileon
  • krileon
  • ONLINE
  • Posts: 48466
  • Thanks: 8280
  • Karma: 1443
11 years 2 months ago #232716 by krileon
Replied by krileon on topic Bootstrap Template and Column Width
It is fixed. It uses responsive design. Allowing you to supply a custom width would break this. For now you need to manually edit the PHP file and change what column size it uses. Next CB Bootstrap release will try to guess best column size based off the width parameter. Please search as have covered adjusting the width quite extensively.


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.

11 years 2 months ago #232900 by edmundcheong
Replied by edmundcheong on topic Bootstrap Template and Column Width

CB Bootstrap does not use the width % as configured in backend. It uses special width sizes provided by Bootstrap CSS file so responsive design works, which wouldn't work with use defined widths. To change the widths you need to edit the below template file and in _render of CBProfileView_html_bootstrap change the column used for left/middle/right to whatever column size class you want (cbColumn1 to cbColumn12 supported).

/components/com_comprofiler/plugin/templates/bootstrap/bootstrap.php

This usage is the same as Fluid Row Spans used by Bootstrap and demoed below. Note ensure you're using latest CB Bootstrap release for this to work as described above.

twitter.github.io/bootstrap/scaffolding.html#fluidGridSystem


I found this thread but some how I can adjust the column, can you "spoon feed" to me where exactly do i adjust the column for the profile view? I would like to increase the left column..

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

  • krileon
  • krileon
  • ONLINE
  • Posts: 48466
  • Thanks: 8280
  • Karma: 1443
11 years 2 months ago #232931 by krileon
Replied by krileon on topic Bootstrap Template and Column Width

I found this thread but some how I can adjust the column, can you "spoon feed" to me where exactly do i adjust the column for the profile view? I would like to increase the left column..

IN: /components/com_comprofiler/plugin/templates/bootstrap/bootstrap.php
ON: Line 58
FROM:
Code:
$return .= '<div class="cbPosLeft ' . $topClass . '">'
TO:
Code:
$return .= '<div class="cbPosLeft COL_SIZE_HERE">'

Replace COL_SIZE_HERE with cbColumn1 - cbColumn12. There are up to 12 sizes and can use whichever size you like. You will need to balance the columns though. So after adjusting the left column you'll need to balance the middle and right column below it. For example if you set left to cbColumn10 then you've 2 column width left so if you only use left and right then left can be cbColumn10 and right can be cbColumn2.


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.
The following user(s) said Thank You: edmundcheong

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

Moderators: beatnantkrileon
Powered by Kunena Forum