vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB4 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=251)
-   -   3 Columns grid of 360px,300px,300px (https://vborg.vbsupport.ru/showthread.php?t=234148)

Demo16 01-25-2010 06:15 PM

3 Columns grid of 360px,300px,300px
 
Hi guys I just bought the VB4 with the CMS. I'm starting adapting the CMS layout to our website but I think it has come limitations. I would like to decide myself the width of the columns in the grid section but it seems to be fixed to their default. Is this correct or am I missing something?

And another thing the grid 3 Column (50%, 25%, 25%) is not like that is like (25%, 25%, 50%). Have you found the same problems?

Alek

--------------- Added [DATE]1264521039[/DATE] at [TIME]1264521039[/TIME] ---------------

No help at all?

Demo16 01-27-2010 12:10 PM

No one else need this feature?

DJRu 01-27-2010 12:46 PM

Same here....

Can't figure how to manage column width using fixed values in pixels.

Lynne 01-27-2010 01:33 PM

You may want to play with the grids. You may create one, then flatten it, and then edit the html for it to however you want.

Demo16 01-27-2010 02:04 PM

Lynne tnx for the reply, I've already tried that but the html code is with div connected to css style. For example:

<div id="bd">
<div class="yui-g" style="width:360px;">
<div class="yui-u yui-panel">
<ul class="list_no_decoration" id="widgetlist_column2">$column[2]</ul>
</div>

in red what I've customized. But it doesn't work anyway.
The problem is that divs you can see when you flat the grid use a CSS class stored on a stylesheet, for this reason you must go and edit also the stylesheet It can be done but if there's an update of the board maybe you'll screw up everything. For this reason I am asking if there's an "official" way to do it.

Lynne 01-27-2010 02:18 PM

If there is an 'official' way, then you should ask over on vb.com. Otherwise, the only thing I know about is to change the grids.

Demo16 01-27-2010 02:31 PM

Quote:

Originally Posted by Lynne (Post 1968016)
If there is an 'official' way, then you should ask over on vb.com. Otherwise, the only thing I know about is to change the grids.

but how? As you can see inside the grid the CSS tags won't work.

Lynne 01-27-2010 04:29 PM

I have not played much with changing the grids, so I really can't give you specifics. But, if I were to do it, I would take out the class in the flattened grid there and add my own.

Demo16 01-27-2010 04:46 PM

Quote:

Originally Posted by Lynne (Post 1968124)
I have not played much with changing the grids, so I really can't give you specifics. But, if I were to do it, I would take out the class in the flattened grid there and add my own.

right I thought the same thing, but first I need to find the original class, to copy them and just add my customization. And there's really a mess on the CSS and xml files.

I'll try to start a class from scratch and let you know.

--------------- Added [DATE]1264619786[/DATE] at [TIME]1264619786[/TIME] ---------------

Ok problem solved there was a mistake in my code. So I'll post this for everyone.
Maybe you can stick the thread as SOLVED Lynne I don't know.

Let's say you have this default 33%-33%-33% default layout:

Code:

<div id="doc3">
        <div id="bd">
                <div class="yui-gb">
                        <div class="yui-u first yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column1">$column[1]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column2">$column[2]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column3">$column[3]</ul>
                        </div>
                </div>
        </div>
</div>

you just make like this:
Code:

<div id="doc3">
        <div id="bd">
                <div class="yui-gb">
                        <div class="yui-u first yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column1" style="width:100%">$column[1]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column2" style="width:300px">$column[2]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column3" style="width:300px">$column[3]</ul>
                        </div>
                </div>
        </div>
</div>

Hope this helps other people.

Spiritvn 01-28-2010 03:13 PM

You can rewrite the grid without the yui, add your own css :)

petermclane 02-06-2010 06:47 PM

Quote:

Originally Posted by Lynne (Post 1967982)
You may want to play with the grids. You may create one, then flatten it, and then edit the html for it to however you want.

Curious Lynne, where the html is kept once you flatten. In other words, where does one go in order to edit it?

ty,
P

Lynne 02-06-2010 09:17 PM

Quote:

Originally Posted by petermclane (Post 1976188)
Curious Lynne, where the html is kept once you flatten. In other words, where does one go in order to edit it?

ty,
P

You edit it right there under the Configure link. It actually creates a new grid template, but you edit it using the Configure button next to the grid name.

inigo 07-28-2010 10:05 AM

Quote:

Originally Posted by Demo16 (Post 1968135)
right I thought the same thing, but first I need to find the original class, to copy them and just add my customization. And there's really a mess on the CSS and xml files.

I'll try to start a class from scratch and let you know.

--------------- Added [DATE]1264619786[/DATE] at [TIME]1264619786[/TIME] ---------------

Ok problem solved there was a mistake in my code. So I'll post this for everyone.
Maybe you can stick the thread as SOLVED Lynne I don't know.

Let's say you have this default 33%-33%-33% default layout:

Code:

<div id="doc3">
        <div id="bd">
                <div class="yui-gb">
                        <div class="yui-u first yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column1">$column[1]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column2">$column[2]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column3">$column[3]</ul>
                        </div>
                </div>
        </div>
</div>

you just make like this:
Code:

<div id="doc3">
        <div id="bd">
                <div class="yui-gb">
                        <div class="yui-u first yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column1" style="width:100%">$column[1]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column2" style="width:300px">$column[2]</ul>
                        </div>
                        <div class="yui-u yui-panel">
                                <ul class="list_no_decoration" id="widgetlist_column3" style="width:300px">$column[3]</ul>
                        </div>
                </div>
        </div>
</div>

Hope this helps other people.

I would like to change the grid 2 columns (liquid/liquid) 60%/40% to another one (liquid/fixed) 100%/300px.

The problem is doing this code modification in the grid code, the right column fixes to 300 px, but below is another column of 40% that makes a blank space on the right (because that 40% is bigger than the 300 px of the widgets fixed), so i think i have to touch in other place to fix that other column below the one i have fixed with this mod,

Any ideas?

Thanks ;)

ravencr 09-21-2010 02:55 PM

Adding that code doesn't work for mine for some reason...I want a 20%, 60%, 20% setup, and I can't get it to work at all by flattening the grid and editing the html. Any other thoughts?

Chris

midnz 09-21-2010 06:36 PM

Download the default grids.xml to see how they're made. Make your new grid .xml and then upload it (Grid Manager > Download/Upload Grids).
It worked for me before I stopped bothering with the CMS and started using Logician's Webtemplates instead. More information here.

Lynne 09-21-2010 06:44 PM

Quote:

Originally Posted by ravencr (Post 2101445)
Adding that code doesn't work for mine for some reason...I want a 20%, 80%, 20% setup, and I can't get it to work at all by flattening the grid and editing the html. Any other thoughts?

Chris

20,80,20? That doesn't add up.

If you want help, you need to post exactly what you have tried. We can't tell you where you went wrong when you haven't posted your code (please use code tags).

ravencr 09-21-2010 06:52 PM

Sorry, updated it. As soon as I change it, it converts everything to 1 column. I'll see if I can follow the last guy's post too.

Lynne 09-21-2010 06:54 PM

I actually helped a guy with the css for a 20, 60, 20 widget over on vbulletin.com, so you may want to try a search over there.

ravencr 09-21-2010 07:00 PM

Do you know what the title was by chance?

Lynne 09-21-2010 07:20 PM

No I don't. but it was a thread about grids.


All times are GMT. The time now is 03:53 AM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01612 seconds
  • Memory Usage 1,777KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (4)bbcode_code_printable
  • (6)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (20)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete