Adding an additional column?

nedjelco / 2013-02-03 19:25:28   

Hello

I was wondering if it was possible to have a total of 3 columns, one for your menu on the left side, one for project detail text and finally the slideshow for images.

Currently this is what the site is looking like:

nedkarlovich.com/ndxzstudio/

I also have installed the columner theme, is this a solution perhaps?

Thanks

NMK

arsondpi / 2013-02-03 19:47:15   

You can edit the Slideshow plugin and get the text content of the plugin to float:left; - you can do this in the slideshow css file of the format.

nedjelco / 2013-02-03 19:57:18   

Hello

This is the CSS for the slideshow below, which is the text content to edit?

a#slide-next {
    display: block;
    position: absolute;
    z-index: 1006;
    top: 45px;
    text-indent: -9999px;
}

a#slide-next:hover {
    background: url(../img/next.gif) no-repeat right center;
}

a#slide-previous {
    display: block;
    position: absolute;
    z-index: 1006;
    top: 45px;
    left: 0;
    text-indent: -9999px;    
}

a#slide-previous:hover {
    /* background: url(../img/previous.gif) no-repeat left center; */
}

#img-container { position: relative; }
.picture { line-height: 0; }
#exhibit #slideshow { margin-bottom: 0; }
#exhibit .captioning { margin: 0.5em 0 1em 0; padding: 0; line-height: 1.2em; }
#exhibit .captioning .caption p { margin-bottom: 0; }
#exhibit #slideshow .captioning .title { margin-bottom: 0; font-size: 11px; }
#exhibit #slideshow .captioning .caption { font-size: 11px; }

#exhibit .placement-top { margin: 0 0; }
#exhibit .placement-bottom { margin: 6px 0 0 0; }
#exhibit .placement-right { margin: 0; }
#exhibit .placement-left { margin: 0; }

#slideshow-wrapper { padding-bottom: 5px; }

/* #slideshow-nav { position: absolute; bottom: 0; left: 0; z-index: 1; margin: 25px; background: white; } */
#slideshow-nav { margin-bottom: 9px; }
/* #slideshow-nav { font-weight: bold; } */
#slideshow-nav span#total em { font-style: normal }

#textspace p, #textspace blockquote, #textspace code { width: auto; }

#loading { color: #000; position: absolute; z-index: 2000; top: 20px; left: 9px; }
#loading span { background: #fff; padding: 3px; }

#thumbnails { }
#thumbnails a { margin-right: 6px; margin-bottom: 0; }

.nav-above { margin-bottom: 6px; }
.nav-below { margin-top: 12px; }

.thumbnails-above { margin-bottom: 6px; }
.thumbnails-below { margin-top: 12px; }

arsondpi / 2013-02-03 20:17:35   

You didn't need to paste the css style...

Anyhow try adding the following and check if things work:

  1. #textspace, #slideshow-wrapper { float: left; }
nedjelco / 2013-02-03 20:22:45   

Thanks

I added the code and uploaded it however nothing has happened, everything seems as it was previously?

Any ideas? Thanks!

arsondpi / 2013-02-03 20:40:28   

Have you got a url to show us?

nedjelco / 2013-02-03 20:52:21   

Here you go:

nedkarlovich.com/index.php/project/sample-project-/

arsondpi / 2013-02-03 21:07:00   

Not sure why but your p tags have width set to auto.
Something like this fixes it (and gives some padding on the right of the textspace)

  1. #textspace { width:400px; margin-right: 10px; }
nedjelco / 2013-02-03 21:18:21   

Nice!
It is there now but the slideshow is overlapping the text.
I am assuming now I must adjust the paragraph width?

Thanks
N

arsondpi / 2013-02-03 21:21:32   

yes - p tags are set to 450px so you either adjust the #exhibit p, code, blockquote width or the width of #textspace.

nedjelco / 2013-02-03 21:30:56   

Yes I got it working thanks so much!

Would I need to start a new thread for asking how to set up the news feed page like this example:

indexhibit.org/news/

Or can it stay on this thread?

arsondpi / 2013-02-03 21:44:59   

Start a new thread - it's better to keep each thread on one topic so other users don't get confused when they search for answers.

This thread has been closed, thank you.