Page 1 of 2 12 LastLast
Results 1 to 20 of 34

Thread: Make vba modules look like vb widgets

  1. #1
    Join Date
    Feb 2008
    Posts
    296

    Default Make vba modules look like vb widgets

    If you are like me and believe vbCMS is only good as an Article section but want to standardise your site making CMPS modules look like vbCMS Widgets then this is how I did it.

    UPDATES
    11th June 2010 - include fix for collapse module function
    4th Dec 2010 - Step 3 code changed to make it W3 Standards Compliant

    Step 1: You can bypass this step if you do not want to use the default module style for any other modules - I still use it for the center column modules.
    - Create a new template called adv_portal_module_wrapper_old
    - Copy your current adv_portal_module_wrapper template into this and save
    (this is the module wrapper template that you will use for default style modules)

    Step 2: Add the following to your additional.css template
    Code:
    /* VBA CMPS WIDGETS */
    
    .vba_widget { 
        _padding:0;
        overflow: hidden;
        display:vba_block;
        width: 100%;
        clear:both;
        background-color:#f1f1f1;
        border:1px solid #C4C4C4;
        -moz-border-radius:5px;
        -webkit-border-radius: 5px;
        -moz-box-shadow:-2px 2px 2px #C8C8C8;
    }
    
    .vba_block {
        _margin-bottom:4px;
        padding:6px;
        background:transparent url(../forums/images/misc/blog/top-highlight.png) repeat-x left top;
        -moz-border-radius-topleft:5px;
        -moz-border-radius-topright:5px;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-top-right-radius: 5px;
    }
    
    .vba_widget_header h3 {
        color: #424242;
        background:transparent none;
        padding: 0px 6px 2px 6px;
        border:none;
        outline:none;
        font: bold 13px Tahoma,Calibri,Verdana,Geneva,sans-serif;
    }
    
    .vba_widget_content {
        color: #424242;
        border:1px solid #DADADA;
        border-top:1px solid #FFFFFF;
        -moz-border-radius:5px;
        -webkit-border-radius: 5px;
        background:#FFFFFF url(../forums/images/misc/blog/gradient-black-down.png) repeat-x 0 0;
        _background-image: none;
        padding:0px;
    }
    Step 3: Replace everything in your adv_portal_module_wrapper template with this
    Code:
    {vb:raw mods.formcode}
    
    <div class="vba_widget">
        <div class="vba_block">
            <div class="vba_widget_header">
                <vb:if condition="$vba_style['portal_collapsemods']">
                    <a class="collapse" id="collapse_module{vb:raw mods.collapse}" style="position: static" href="{vb:raw relpath}#top"><img src="{vb:stylevar imgdir_button}/collapse_40b.png" alt="" border="0" /></a>
                </vb:if>
                <h3>
                    {vb:raw vba_style.portal_blockbullet} <vb:if condition="$mods['link']"><a href="{vb:raw mods.link}">{vb:raw mods.title}</a><vb:else />{vb:raw mods.title}</vb:if>
                </h3>
            </div>
            <div class="vba_widget_content" id="module{vb:raw mods.collapse}"<vb:if condition="($mods['useshell'] & $vba_shellint['collapse'])"> style="display: none"</vb:if>>
                <vb:if condition="$show['table']">
                    <table align="center" border="0" cellpadding="0" cellspacing="0" class="blockrow" width="100%">
                        {vb:raw modulehtml}
                    </table>
                <vb:else />
                    <vb:if condition="$show['divrow']">
                        <div class="blockrow">
                            {vb:raw modulehtml}
                        </div>
                    <vb:else />
                        {vb:raw modulehtml}
                    </vb:if>
                </vb:if>
            </div>
        </div>
    </div>
    
    <vb:if condition="$show['endform']"></form></vb:if>
    <br />
    This is what I ended up with:
    Attachment 5864

    Hope this helps someone
    Last edited by ibaker; 12-03-2010 at 08:22 PM.

  2. #2

    Default

    Great !
    If you want Vbadvanced Customized main page,PM me

  3. #3

    Default

    Awesome!! This is just what I was wanting!

  4. #4
    Join Date
    Jan 2010
    Posts
    1

    Default

    Nice work

  5. #5
    Join Date
    Dec 2004
    Posts
    13

    Default

    Looks good, but you can't collapse the modules. I don't mind though! Thank you.

  6. #6
    Join Date
    Jun 2009
    Posts
    6

    Default

    http://www.nextgenerationgamers.co.uk

    I have applied the changes above but it does not look to good maybe due to the colouring

    I am new to vb and any help with making the change to suit wwould be great

    Many thanks in advance

    cheers

  7. #7
    Join Date
    Feb 2008
    Posts
    296

    Default

    Quote Originally Posted by betts02 View Post
    http://www.nextgenerationgamers.co.uk

    I have applied the changes above but it does not look to good maybe due to the colouring

    I am new to vb and any help with making the change to suit wwould be great

    Many thanks in advance

    cheers
    Do you just have vb forums and not the extra vb products of blogs and CMS - it looks like the images are not showing so I guess you don't have them.

    The two images you need are referenced in the code and would be located in the images/misc/blog folder and I am guessing that I legally wouldn't be allowed to attach those images as they would belong to vb

  8. #8
    Join Date
    Feb 2008
    Posts
    296

    Default

    Can anyone help with figuring out a way to make the collapse work properly?

  9. #9
    Join Date
    Jun 2009
    Posts
    4

    Default

    Quote Originally Posted by caitian View Post
    Can anyone help with figuring out a way to make the collapse work properly?
    This would be good.

  10. #10

    Default

    In the template code supplied, the images are being referenced in a /forum/ folder... anyone that has their forums in a different folder will need to update those 2 spots in the template code given (and need to have the blogs installed

    Great work though, thanks!
    Quote Originally Posted by caitian View Post
    Do you just have vb forums and not the extra vb products of blogs and CMS - it looks like the images are not showing so I guess you don't have them.

    The two images you need are referenced in the code and would be located in the images/misc/blog folder and I am guessing that I legally wouldn't be allowed to attach those images as they would belong to vb

  11. #11
    Join Date
    Feb 2008
    Posts
    296

    Default

    Note: The opening post has been updated to include the fix for the collapse module function
    Last edited by ibaker; 12-03-2010 at 08:16 PM.

  12. #12
    Join Date
    May 2004
    Posts
    101

    Default

    This is fantastic... thank you very much!

  13. #13

    Default

    Since I tried to install this it messed with my virgin VBA install. It has made it so that the images I put into modules are all padded on the right bu quite a lot. Also when I first set this up, the modules simply showed white borders and not the color that I have got setup.

    Does anyone know why the modules with images now pad on the right, I have removed this code yet the proble still exists.

  14. #14
    Join Date
    Jun 2010
    Posts
    12

    Default

    This is great sir, perfect! Like the CMS, with nothing to envy. Thank you very much for giving us all and free.

    We expect some further changes and some widgets or modules. Thanks!!

  15. #15

    Default

    great

    thnx million it's really nice

  16. #16
    Join Date
    Oct 2009
    Posts
    3

    Default

    Brilliant! Much appreciated.

  17. #17
    Join Date
    Feb 2008
    Posts
    296

    Default

    My pleasure mate

    Note: I am dumping vb and are in the process of moving all my sites over to Xenforo so as soon as Brian releases CMPS, Dynamics and Links for Xenforo I hope to start contributing as many enhancements as I can for that great combination of forum software.

    Example: http://www.recreationalflying.co.nz

  18. #18
    Join Date
    Oct 2009
    Posts
    3

    Default

    Great mod, many thanks.

    BTW How can I make them appear with drop shadows?

  19. #19
    Join Date
    Aug 2004
    Posts
    23

    Default

    thanks, works great !

  20. #20
    Join Date
    Jul 2010
    Location
    Chicago, IL
    Posts
    3

    Default

    This looks great. Thanks for doing this. I will be working this very soon.

Page 1 of 2 12 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. widgets
    By ttnb in forum Module & Modification Discussion & Requests
    Replies: 1
    Last Post: 08-22-2011, 07:25 AM
  2. widgets
    By ozidoggy in forum Modifications
    Replies: 22
    Last Post: 10-01-2010, 03:54 PM
  3. Widgets on vbadvance page
    By wmlvb in forum Module & Modification Discussion & Requests
    Replies: 0
    Last Post: 09-13-2008, 12:00 PM
  4. How can I create module to show these widgets?
    By GentleOceanWind in forum "How Do I..." Questions
    Replies: 3
    Last Post: 04-30-2008, 01:06 PM
  5. weather and fox nfl widgets
    By StuntFactoryX in forum Add-On Modules (version 3.x & 2.x)
    Replies: 13
    Last Post: 12-12-2007, 03:16 AM

Posting Permissions

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