Question about home page
-
Is there any way to reduce the space between the links on the Ticker/Home page? Less white space? I don’t want them all bunched together too close, but maybe some CSS to play around with where I can adjust the space would be nice.
Also, is there a way to add a vertical line – similar to the horizontal line I have separating some of the lines on the home page – between each column? This would help give some added structure to the page.
-
You can set the value to whatever you want here and it will adjust the spacing between the paragraphs of the home page content:
body.home .content p { margin-bottom: 1em; }For the vertical lines, they can only be as tall as the content they’re next to but you could include them with code like the example below. You’ll have to adjust the padding and you might need to remove the earlier line that just targeted the last column.
.display-posts-listing li.listing-item { padding: 0 15px; } .display-posts-listing li.listing-item:nth-child(-n+2) { border-right: 2px solid #808080; } -
That helped a lot! Is there any way to remove the space on the sides? Not sure if that’s just the margins or padding. There can be a slight edge of white, but, ideally, I’d like my text to stretch from one side to the other – not just in the middle of the page.
Make sense?
-
Hi there, it is best to keep a bit of whitespace to the left and right of content as it makes easier reading by giving the eye a landing place when returning to the next line. We can widen things a bit using the following though. See what you think.
.home .site-content .container { max-width: 100%; }I’ve targeted only your front page with this.
-
-
-
A few other questions…
– Is there a way to make the vertical & horizontal lines on the main page more translucent? This is a tad picky, so don’t worry about it if there’s no code to specifically target the lines.
– How do I add email to the social menu in top right corner? Not a CSS question so feel free to ignore :) Would appreciate the help though if an easy fix.For the other questions, you can use this post as reference: https://grandstandnews.com/2016/02/16/798/
– Can I remove the drop cap on blog posts?
– How do I change the link hover color in posts? Right now it’s a gray color. I want it to return to the default light blue shade (see link color on CNN: http://www.cnn.com/2016/08/22/politics/north-korea-south-korea-us-military-exercise/index.html).
– Is there a way to fix the comment box at the end of the post? Right now it’s a dark gray and the text below it is either *barely* visible or not visible at all. I’d like the box to be white and the text below it (next to the check boxes) to be black.
– Is there a way to remove “Posted in Blog. Bookmark the permalink.” below the post?
– How can I include the date underneath the title in the image box on my “Blog” display page? Or is it not possible?Thanks! Take time responding – no rush.
-
You could make the lines translucent but it doesn’t make sense to as there’s nothing behind them. You can easily change the colour though, just use a different hex code in this section of your existing CSS:
.display-posts-listing li.listing-item:nth-child(-n+2) { border-right: 2px solid #f00; }That will take care of the vertical lines we added, this will do the existing horizontal ones:
hr { color: #f00; background-color: #f00; border-color: #f00; }Here’s how to change the link hover colour:
hr { color: #f00; background-color: #f00; border-color: #f00; }This will hide the post metadata, change the checkbox labels to black and change the comment box to black on white instead of white on grey:
body.single .entry-footer { display: none; } div#respond p.comment-subscription-form label, .highlander-dark #respond label { color: #000; } .highlander-dark #respond #comment-form-comment, .highlander-dark #comment-form-share-text-padder { background-color: #eee; box-shadow: none; border-color: #afafaf; } .highlander-dark #respond #comment-form-comment textarea, .highlander-dark #comment-form-share-text-padder textarea { text-shadow: none; color: #000; }It’s tricky to move the date as your titles could be any size or length, expecially when you take into account all the devices your site visitors might use.
I can’t see any drop caps on your posts, did you remove them already?
-
I think you put in the wrong code for the link hover color? Other stuff is helping – thanks!
-
-
Is there any code that will restrict the size of the photo I want to use for the middle column on the front page to fit within the width of the two vertical lines? On my 17″ monitor, the photo overlaps the two lines and some of the text in both the left and right column. On my 19″ monitor, it fits within the vertical lines. To prevent any style mishaps in the future, can you help me find code that will always restrict the photo I use for the middle column to fit within the vertical lines/not overlap?
-
-
That’s a feature of your theme for center aligned images however it doesn’t work with the three column layout. Try overruling it just on the page you have the new columns:
body.home .content span.aligncenter { margin: 0; } -
Check out post formats for video posts although different themes treat these different ways, some do nothing at all. See the videos support page for an overview.
-
I apologize. The post format I need help with is actually the “Link” format. I don’t want them to play the video on the site, I want to redirect them to the video page (whether its vimeo, youtube, etc.)
So on the link post, is there nothing I can do with the code for the entry-title? I’ve uploaded a link post on the blog page as an example. The two blog posts to the right are actually in the “Image” post format. Notice the headline below the image? I think this code activates it:
.archive__grid .format-image .entry-title { color: #000; font-size: 1.5em; line-height: 1.33333; margin: .66667em; margin-bottom: 1.75em; }There is a headline for the link, but it’s not appearing. Is there anyway to activate it? I looked through the two links you provided but couldn’t find an answer. In fact, if you hover your mouse over the link image on the left, you will see the headline appear. There’s also a line below the link post, but no text. Thoughts?
FYI – the centering code helped. Thanks!
-
It looks like your theme is set up so that posts in the link format don’t show the title. There’s not much you can do about that. Although there’s no reason you can’t post the link without using the link post format, then the title would still appear.
-
-
-
With Hive, if you put in a title for a link post and then some linked text within the post content area, even something as simple as inserting the link and then using the “Link” button in the editor tool bars to link that to the URL, then the title of that Link Post will link to the site that you include the URL for.
-
Yes, it does. But not if you include an image. The image becomes the link, the title disappears. I want an image AND a headline using the Link post format.
- The topic ‘Question about home page’ is closed to new replies.
WordPress.com Forums 