WordPress Plugin Interaction Issues, Need Help! (Offering small payment!)

[okayhowsthis]

Wordpress Theme Issues and Ugly Plugin Interactions
I am designing a website to replace my schools awful old website. I picked WordPress as the platform because this website needs to be editable in the future by less then savvy tech people, and I myself don’t have the skill or knowledge to create a website from scratch with the functionality they desired.

The website is: trustusclothing.com/crtc

I’m having tons of issues with my theme (Alhena) and the plugins Fiat Alert Bar and Revolution Slider interacting all poorly. I believe this is just due to poor CSS coding on their end. I fix one problem, and another is immediately created.

---

FIRST PROBLEM

My revolution sliders all have the same top-margin-px value. Code can be seen here, in revsliders.css. The original top margin the plugin had was -50px. This -50px caused my top slider to fit nice and flush against my nav bar. Pictured below.
Code:

.rev_slider_wrapper.fullscreen-container,
.rev_slider_wrapper.fullwidthbanner-container {
    margin-top:-50px !important;
    outline:none;
}

Top slider flush with a margin-top of -50px.
Image Example
However, this top margin causes all the other sliders on my site (BESIDES ONLY THAT TOP ONE) to have awful problems with fitting in their containers and being separated from their titles. Pictures below.

Image Example
(Slider from the bottom of my homepage)

Image Example
(Slider from the bottom of a page from the “Programs” top navbar tab, see how the top just sticks out of the container?)

So the easy fix is to just change that margin-top to 0px right? Nope, that’s what I thought at first, but that messes up the top slider on my homepage, while fixing all the others however.

Image Example
Top homepage slider seen with margin-top of 0px.

I know this is some issue with CSS specificity, but I don’t know how I’d specify to keep the top sliders margin-top to -50px, and all the others to 0! Any ideas?

---

Second Problem

So this is a site designed for a school, so they wanted functionality of adding an alert bar in case of snowdays and other urgent issues. So I found the WordPress plugin Fiat Alert Bar. At first I thought this was great but then I found an issue.

A page with a sidebar before Fiat Alert Bar is enabled:
Image Example
The sidebar, as it should, is lying to the right of the main content.

A page with a sidebar after Fiat Alert Bar is enabled:
Image Example

The sidebar gets pushed below the content. This is wrong.

How do I fix this sidebar issue in relationship to the plugin?

---

I know I’m asking a lot out of you guys to help me fix, especially in my first post. But I’m still learning CSS and would really appreciate all the help I can get. If you post a fix for me, include your Bitcoin address if you want/have one, and I’d be happy to send you a small token of appreciation. Thank you all for your time!

[burr]

I don’t know how I’d specify to keep the top sliders margin-top to -50px, and all the others to 0! Any ideas?

Did you try give the homepage silder a unique ID or Class and target that with -50px only?

e.g
HTML / PHP

<div class="rev_slider_wrapper..." id="home-page-slider">

        ...

</div>

CSS

.rev_slider_wrapper.fullscreen-container,
.rev_slider_wrapper.fullwidthbanner-container {
    outline:none;
}

#home-page-slider {
    margin-top:-50px;
}

[okayhowsthis]

I picked WordPress because I thought with my basic HTML knowledge it’d be easy enough. Little did I know I’d be jumping headfirst into the CSS Combat zone.

How would I specify the homepage slider?? Sorry if these are stupid nooby questions

[burr]

Check above

[Alen]

Give us the actual URL for the pages in question. I’m not seeing the issue you’re referring to. I’m on Chrome.

[Soren]

Me neither. I see no slider below the nav on home page. I do see the SECOND PROBLEM, though.

Your site uses bootstrap’s 12 columns. You have this HTML on your home page:

div class = span12 (main content) 100% width
div class= span4 (sidebar) 33.3333% width

12 + 4 = 16.

This is why the sidebar falls below. We need 8 + 4. Check the pages you have a sidebar on. Make sure main content div’s class is span8 not span12.

[okayhowsthis]

There is a slider just about on every page. It’s not showing on the homepage right now because the alert bar is turned on. Another issue.. If you guys would like I can turn it off just to show that, just let me know what you need to diagnose the issue more completely.

The problem is that wordpress does not generate a seperate html/php file for each page of the site, it just pulls from theme templates. So I can’t find in any of the files where these spans are being set.

Also I really have no idea what I replace the “…” with with this code

<div class="rev_slider_wrapper..." id="home-page-slider">

        ...

</div>

And where to put this code as once again wordpress generates files weirdly. I’d be willing to post more pics of file directorys, etc, or give someone access to my wordpress login if that user has a large number of posts and appears trustworthy.

[okayhowsthis]

The problem is that wordpress does not generate a seperate html/php file for each page of the site, it just pulls from theme templates. So I can’t find in any of the files where these spans are being set.

[Soren]

I’ve had a quick look at the Alhena (free version) theme and it’s one of those themes where you can change page layouts without touching a line of code via admin customisation options. I think any of us saying just change this CSS here and that HTML there is not the best solution.

You just need to understand your theme a little better or like you said give someone access to the files.

[okayhowsthis]

Image Example

Here is an example of my config options for the slider. Even if I define a -50px top margin, the theme (or slider?) ignores it. This means something must be overriding it but I can’t find it.

In response to the sidebar issue I think it’s just that when the alert bar is turned on it is adding additional spans somehow. When the alert bar is off everything is great in relation to the sidebar issue.

Would you be willing to help me out if I gave you access?

[Author]

Posts