Sidebar Redux

[Brian]

Apr 11, 2013 10:23:49 GMT -8 ?Leslie? said:

That worked awesomely! How might I go about centering the selectable links in the drop down? I tried to center the options on their own and that didn't work. Sorry to be a pain!

You'd need to use CSS for that.

First, you'd need to add a class to the code's <select> element.

<select accesskey="S" onchange="goToPage(this.options(this.selectedIndex).value)" class="select-center">

Then you'll want to add a CSS declaration using that selector telling it to center align the text.

<style type="text/css">
.select-center { text-align: center; }
</style>

[Maiden]

So I've tried to do the dropdown thing in my sidebar as well and it doesn't work for me

I've tried the script in the global headers and the plugin header, and even just copied exactly from the site you linked to it didn't work.

solariaweyr.proboards.com/

Any ideas?

[Sunny]

Hhmmm. I wish I could help but I'm not sure how to use that code in the plugin just yet. However might I ask how you got your table with your cbox to be fixed? Was it just the option in the plugin?

[Brian]

Apr 12, 2013 1:20:57 GMT -8 Maiden said:

So I've tried to do the dropdown thing in my sidebar as well and it doesn't work for me

I've tried the script in the global headers and the plugin header, and even just copied exactly from the site you linked to it didn't work.

solariaweyr.proboards.com/

Any ideas?

You need to copy the Javascript code above it from that site. That's what tells it to change the page.

Apr 12, 2013 9:09:27 GMT -8 Sunny said:

Hhmmm. I wish I could help but I'm not sure how to use that code in the plugin just yet. However might I ask how you got your table with your cbox to be fixed? Was it just the option in the plugin?

She modified the plugin's source code, but it's a little buggy. Whenever her containers reach the bottom of the page, they disappear.

[Maiden]

But where too? I've tried global headers, plugin headers and just now above the drop down code itself (though it possible I borked the code as phone wasn't playing nice with the boxes)

The fixed cbox is selecting fixed yes on the left sidebar tab. That's built in. And as Brian said the about us box I put into the build section and it does make the cbox vanish if you scroll right to the bottom.


Sent from phone, please forgive typos!

[Brian]

You can put it right above the rest of the code inside the sidebar and it should work. The only prerequisite for the code to work is that it needs to be before the dropdown in the document body.

[?Leslie?]

Apr 8, 2013 14:54:10 GMT -8 Brian said:

Apr 8, 2013 14:40:20 GMT -8 ?Leslie? said:

Okay...say I just want to remove the navigation tree....do you have any idea how I would go about that?

Structure > Layout Templates > Forum Wrapper

Remove the following from the HTML.

<div id="navigation-tree">
    $[navigation.tree]
</div>

Test Site

Okay, so I didn't get around to removing my Navigation Tree until just now. When I did it left the "Participated" post button in the same exact place that it was before I removed the nav-tree. I'd like to keep the participated post button on the forum for the members, but is there a way I could move it into my navigation bar with the rest of the site links?? Thanks for all of your help so far Brian, you're awesome!

Also, I was wondering where exactly I put this bit of code:

<style type="text/css">
.select-center { text-align: center; }
</style>

Because I tried to put it in a couple of places and it didn't work. If you could take a look and let me know, I would really appreciate it.

Another thing I was going to ask is if you could look at my drop-menu in the sidebar....if I select one of the items listed it doesn't go to the page. I just want to know if I'm doing something wrong.

[Julian D]

I am having a problem with the alignment of the title image. When I put in the html image in the 'title' field of a box, it displays the image spilling over to the right side due to a margin at the left side in which the image is not displayed (ie there is a margin on the left side that looks like it might be 20pxls long which forces my image to stick out that far from the sidebar box)

I have tried telling it to align differently in the html for the title image, I also tried setting the image as a background image and telling it to align in the style page, but while i could get the color transparent and put in the coding for the image to display (it showed no errors when saved ) It then refused to display my image as a background.

I can make the sidebar bigger but I don't want that unsightly margin, and my site has sidebars on both sides as is, even with my forum width altered to accommodate widescreen monitors I don't have the space to be wasting to keep these margins. Any ideas on what I should do?

[Brian]

?Leslie?: The participated button is dependent on the navigation tree. I imagine some Javascript and CSS will be able to move it. All of the codes should work in your sidebar.

This will move the participated button.

<script type="text/javascript">
$(document).ready(function(){
$('#move-participated').append($('.recent-threads-button'));
});
</script>

Place this where you want the participated button to be:

<div id="move-participated"></div>

And since you're moving the participated button, we'll add on to the CSS code.

<style type="text/css">
.select-center { text-align: center; }
.recent-threads-button { float: none; }
</style>

Julian D: The .title-bar class and the <h2> elements inside it have pre-defined CSS. Normally these areas are reserved for text.

Place this at the bottom of Themes > Advanced Styles & CSS > Style Sheet if you're using images for every title bar in the sidebar. If your sidebar is on the right, substitute #sidebarr-left with #sidebarr-right.

#sidebarr-left > .container > .title-bar {
    min-height: 0;
    padding: 0;
    margin-bottom: -3px;
}
#sidebarr-left > .container > .title-bar h2 {
    line-height: normal !important;
}

If you're only using images in certain sidebar containers, use this code instead, substituting the text in green with the ID you've given your sidebar container. You'll need to add a new instance of this code for every container applicable.

#your-box-id > .title-bar {
    min-height: 0;
    padding: 0;
    margin-bottom: -3px;
}
#your-box-id > .title-bar h2 {
    line-height: normal !important;
}

[Julian D]

Thank you Brian! ^^ I wouldn't have ever figured that out.

[Nevada Mikado]

ok, I feel like a total spaz, and I'm sure you have gone over this somewhere and yet I can't find it (or I'm having a total blonde moment). But I can't seem to get the weather plug in inside the container and I can't figure out what I have done wrong. wulfheart.proboards.com/ do you think you can help me out? Also, how to I center the text "clear & date".

[Brian]

Apr 14, 2013 9:27:36 GMT -8 Nevada Mikado said:

ok, I feel like a total spaz, and I'm sure you have gone over this somewhere and yet I can't find it (or I'm having a total blonde moment). But I can't seem to get the weather plug in inside the container and I can't figure out what I have done wrong. wulfheart.proboards.com/ do you think you can help me out? Also, how to I center the text "clear & date".

You have the ID of the container set as weather and you have <div id="weather"></div> inside of your sidebar container, meaning there are two things with the same ID on the page. No two objects can have the same ID.

To fix this, simply remove weather from the ID field of your container.

[Nevada Mikado]

Ahhh so that's what i was doing wrong, Thank you... i also feel really stupid now lol. But thank you again

[Julian D]

I'm not sure if this question is right for this thread, but it is in the sidebar. 


So one of my containers in the sidebar has a few drop down menus in them.  The problem is they are all sandwiched together.  There is enough room for them to be spread out, but the <br>  makes too large of a space.  I couldn't find any br height defining code that I could get to work in the sidebar content field.  I only need about 3-5 px spacing between them.  Any suggestions?  

[Brian]

Apr 14, 2013 19:43:42 GMT -8 Julian D said:

I'm not sure if this question is right for this thread, but it is in the sidebar. 


So one of my containers in the sidebar has a few drop down menus in them.  The problem is they are all sandwiched together.  There is enough room for them to be spread out, but the <br>  makes too large of a space.  I couldn't find any br height defining code that I could get to work in the sidebar content field.  I only need about 3-5 px spacing between them.  Any suggestions?  

You can try adding margin-bottom: 6px; or something to their existing style attributes. That way you can define an exact pixel value for the spacing.