HELP WITH CSS FOR ZUKI THEME
-
HI
1. would like to make the header font larger
similar layout to this blog
http://lindyklim.com.au/2. would like to add social icons / the menu directly
3. change the width of the columns to be more narrow
similar to this blog
http://www.theyallhateus.com/The blog I need help with is: (visible only to logged in users)
-
Hi there,
1. would like to make the header font larger…
Are you talking about the “Home” text in the header or something else?
2. would like to add social icons / the menu directly
This can be done, and I gave a pretty detailed description of the process in this other thread. The procedure is the same in all themes. I assume you would be wanting to use the icons you now have in the sidebar text widget, yes? If you need help with that, we can assist you.
3. change the width of the columns to be more narrow…
The site you referenced has a container width of 826px. Add the following CSS and you can adjust as desired. I used 850px in my example.
#container { max-width: 850px; } -
Hi! I also have a CSS question for the Zuki theme. I would like to make my header image larger and centered, similar to this showcased blog: http://showcase.elmastudio.de/2014/09/30/witchin-in-the-kitchen-zuki/
Thank you!!
-
I’m seeing the hardly snarky logo/title image on hardlysnarky.com centered. If you want the text in the image larger, you can edit your original image in the image editing program on your computer and resize and tighten the crop so that it takes up more of the 920 x 180 space and see if that works.
Zuki also has the flexible header feature, where you can upload a header of any size to use on your site and then when you get ready to insert that image, you “skip” the cropping. So if resizing and tightening the crop doesn’t do the trick, create a new header image at the size you desire and upload that and choose not to crop it. I would suggest keeping the image at 1000px wide or less.
You might see if resizing the image and doing a tighter crop would give you what you want.
-
Hi @thesacredpath! Thanks, I did (finally) figure out how to center it! Now I am trying to get the extra space under the header to go away…it is there as a result of the primary menu feature in the theme that I don’t want to use.
Thank you for any help you can give, as always!
Anne
-
Anne, I answered you in the other thread on that: https://en.forums.wordpress.com/topic/help-with-zuki?replies=3
-
Hi Sacred Path
Thanks for the centering logo details, just saw all this now.
I have another question- when you look at my blog on a mobile phone like my Samsung- it doesn’t show the logo- only a white box with black outlined and the number 150 in the corner shows up- it seems on an iphone its fine and you see the logo- but not on my samsung.
Can this be fixed?
Also is there a way you can have the format of what you see on your computer the same layout as what you see on your phone?
My other question is- when you click on the categories above the logo like style, fashion, my causes etc it takes you to the page with just those articles but then it only shows the text and no picture when u click into the category- is there a way to keep it looking like it does on the front page? with at least 1 pic and wording when u click into a category?
Thank you for the replies.
-
HI there
Not sure if you got my last message i am trying to fix the way the blog comes up on my mobile- the front page is showing just a white box without the name of my blog ( inside the big white box is the number 150)
I have a samsung note 3
On the iphone it comes up fine- can you help?Also can i get the mobile version looking the exact same as the web version? the widgets are in a different spot etc…
Best Regards
Ange :) -
hi sacred path
i dont seem to be getting a response from you….
Are you seeing my messages?
-
Hi! @thesacredpath is traveling, but there are still others around helping out. Our CSS community is pretty awesome. Let me see if I can help! I was just stopping for a meeting now, but I’ll be back around to look at this in more detail soon.
-
Hi, I’ve had a chance to sit down and look at your site now.
I have another question- when you look at my blog on a mobile phone like my Samsung- it doesn’t show the logo- only a white box with black outlined and the number 150 in the corner shows up- it seems on an iphone its fine and you see the logo- but not on my samsung.
I see this in a browser as well. I think it is happening because you uploaded an image, then set it as the site logo in the Appearance > Customize > Site Title panel and then perhaps you deleted that image from the image library in your blog dashboard. The image would still show up for a little while if it were cached locally (that’s probably why it seemed to be working on your iPhone still), but if the image was deleted, then the cache will eventually expire and it will either look broken or get ignored at some point on the iPhone as well.
To fix the problem, go to Appearance > Customize > Site Title and click the “Remove logo” button if you want to just get rid of that box or click the “Change logo” and select a different image for that space.
Make sure you don’t delete the image you’ve selected from your media library later. It has to be present in the media library for it to work on the website.
-
Also can i get the mobile version looking the exact same as the web version? the widgets are in a different spot etc…
Most modern themes these days use what is called a responsive design. That means that the theme author has specifically changed some parts of the layout of the theme so it is more readable and friendly on mobile. It’s possible to remove responsive design, but it takes work and would take you some time to set it up. I can give you instructions for doing that if you are really keen on the idea, but I would not recommend it. Doing that is an advanced change and would require you to know your way around CSS really well to make further small CSS changes in the future.
Another option for you might be to use the mobile theme. It’s a completely different layout that gets applied only to mobile and, although it won’t look the same as your site on the desktop, it will change it and you could try it out to see if the simpler design is something you like as an alternative. If you’re interested, see this help page to learn more:
http://en.support.wordpress.com/themes/mobile-themes/
- The topic ‘HELP WITH CSS FOR ZUKI THEME’ is closed to new replies.
WordPress.com Forums 