Customization issues with color and moving credit bar to bottom of page

freckledorganizer · Member · Apr 23, 2013 at 3:25 pm
Copy link

Add topic to favorites
Hi – I purchased a customization package. Here are the problems I’ve run into:

1.) Although I go to “pick your own color” for my site header, I am only allowed to use specific shades of each color group. I want a bright yellow. Instead I get only the option for a sort of dark yellow/brown. This seems not very customizable.

2.) I have the “balloon” theme. Although I had no trouble removing the balloons themselves and the weird bar that was covering my background image, the blog credit is now over my main image in the middle of the page and I cannot seem to get it to move to the bottom of the page.

Here is the site to see for yourself:

freckledorganizer.com

Please help at your earliest convenience.

Thank you,
Sharon Harms
freckledorganizer · Member · Apr 23, 2013 at 4:11 pm
Copy link
I also just found that even though balloons don’t show up on my computer, they show up on my mobile devices (iPad and iPhone). I triple checked and the CSS settings button to apply to mobile is checked. Don’t understand the issue.
thesacredpath · Member · Apr 24, 2013 at 12:20 am
Copy link
The custom color thing supports all web safe colors, possibly even websmart. You can use any hex color code you want, entered in the box, but do note that most browsers are going to take that code back to a websmart color, so some very pale yellows, greens, etc., could go back to a very light grey when someone views the site.

I use the color studio program on my computer, but there are a number of very good online sources such as this one, which I’ve also used: http://www.febooti.com/products/iezoom/online-help/online-color-chart-picker.html .

I’m not sure what to do to get rid of the balloons. They disappear using display: none; until the browser window gets down to a certain width and then they reappear.

Perhaps @designsimply (staff) will drop by this thread and have an idea as to what to do.
designsimply · Member · Apr 30, 2013 at 8:23 pm
Copy link
I want a bright yellow. Instead I get only the option for a sort of dark yellow/brown.

This sounds like a contrast issue. The color tools in the Custom Design upgrade have some built in contrast rules for accessibility. They try to make sure that the text is still readable for visually impaired readers. It should be seamless for the most part. You can override the contrast rules by using custom CSS to set colors.
designsimply · Member · Apr 30, 2013 at 8:51 pm
Copy link
I also just found that even though balloons don’t show up on my computer, they show up on my mobile devices (iPad and iPhone). I triple checked and the CSS settings button to apply to mobile is checked. Don’t understand the issue.

The balloons are setup in different ways for different screen sizes (i.e. iPad, iPhone) using media queries, or @media rules. They’re pretty common to use when creating what designers call a responsive design. This is a nice overview if you want to take a look:
https://developer.mozilla.org/en-US/docs/CSS/Media_queries

The mobile checkbox applies to the mobile theme which can be turned on or off from your Settings → Mobile admin page. It’s separate from responsive design. The mobile theme is its own separate theme.

To get rid of the balloons background image that appears when the browser width is 800px or smaller, try adding this to your custom CSS:
```
@media screen and (max-width: 800px) {
	body {
		background: #eee;
	}
	header#masthead {
		margin: 0;
	}
}
```
Are you still seeing any other balloons if you add that?

No items found.