Mobile & Logo

Hi,

for our page located at http://www.germanconference.org/WP/, we are having some trouble both with our logo (vector on transparent background is in progress on our designer's part) and the mobile view of the site — not entirely sure what's wrong with both, help would be much appreciated.

Thanks!

Silvano

Also, we're using the FAQ template for our Team page, but they're open from the start and non-closable; we can't quite figure out on this one either…

Hello,

I need more details, what exactly do you want to change with your logo? (margin, position), regardin the mobile view, it's cause by your custom css from style.css file:

Code: Select all

.frontpage-block {
   overflow: hidden;
   padding: 75px 10% 0px 5%;
}

.frontpage-block-wrap {
   margin: 0px 50px 0px 50px;
}


remove this code or use another values.

Regarding the FAQ, the syntax is wrong, your dd content (stared from "Anna Lea is concentrating in Integr...") should be wrapped inside <p>..</p> paragraph tag

Thanks so much, this was already very helpful! Re:logo — as the menubar scrolls down, the top gets cut off; I presume this is because of how far it is allowed to move "into" the content, but I'm not sure which values to change or whether it might also be possible to have the menubar be a little taller or even load a smaller version of the logo for the menubar? Again, thanks a bunch!

Try to add the following code to your css files (you can use css/override.css file or any custom CSS plugin):
https://www.gavick.com/blog/adding-cust ... ress-theme

Code: Select all

#gk-header-nav.active #gk-logo,
#gk-header-nav.active #gk-logo-css,
#gk-header-nav.active #gk-logo-css-big {
   left: 0;
   margin-left: -15px;
   top: -40px;
}
#gk-header-nav.active #gk-logo:hover,
#gk-header-nav.active #gk-logo-css:hover,
#gk-header-nav.active #gk-logo-css-big:hover {
   top: -35px;
}


Sorry to bother you once more — two more questions:

1) Is there any feasible way to increase the logo size (both in the menubar and before on the front page)? Similar to how we've tried it before: http://www.germanamericanconference.org

2) Still struggling a little with different screen sizes. My idea would be to have the content span about 80% of the browser window, regardless of its size with a maximum of, say, 1200px, but be centered regardless. Related: Can the table used to design the agenda part of the front page be customized to display only one column depending on the device size?

Again, thank you so much for the support!

Silvano

Hello,

Regarding your questions:
1. Try with following css code:

Code: Select all

#logoImage img {
max-width: 500px;
}


2. Try to add following css code:

Code: Select all

.collection-type-index .page-content {
  max-width: 80%;
}

@media (max-width: 640px) {
.sqs-col-12 .sqs-col-4 {
    width: 100%
}
}


Dear Piotr!
Thanks for your help.

Unfortunately the codes do not work.
1) The logo is still to small - and actaully we would like to align it to the left corner.
How can we do that?

2) Furthermore, the width of our page is still worrying us. How can we make sure that we are using the full width? Do we have to change the number in that layout section? http://www.germanconference.org/WP/wp-a ... ted%3Dtrue
What sized do you reccomend to put in there?


3) How can we change the background colour of only one page/section?

Where exactly in the editor do I have to fill the new CSS code in you are giving to us?

Thanks for your time!

Hello,

I can't see the code from my previous post on your website. Please add it into Events/css/override.css file or use custom css plugin described here:
https://www.gavick.com/blog/adding-cust ... ress-theme

Regarding the theme width settings you can test some values and choose the best for your needs. (on your frontpage it may be overriden by other plugins used).

Regarding hte backgorund color, which section/page exactly do you want to change?

Hello!

What is the perfect photo size for the header? (now it duplicates itself at the side)

http://www.germanconference.org/WP/

Thanks for your help

Best
Julia

Hello,

The default image header size is 2560 x 838px.