Edits to homepage/news feed structure (cont)
-
A few style questions…
1) How do I make my page have unlimited scrolling?
2) Can I set a time limit to where posts enter an archive after a certain peroid of time, removing them from the front page?
3) Is there a way to remove the line (features date) above the posts? Either remove altogether, or just keep it as a line and make the date disappear?
4) Is there a way to constrain the page width to the browser? I’m on Google Chrome and have my zoom at 100% and I have to slide over on the page a little bit (not much) to get full width.The blog I need help with is: (visible only to logged in users)
-
1) How do I make my page have unlimited scrolling?
When you add footer widgets, the infinite scrolling is disabled and a Older posts button is placed at the bottom. If infinite scrolling was not disabled, then the footer widgets would not be visible until someone had scrolled all the way to the bottom of your posts. If you wish to have infinite scrolling, you will have to remove your footer widgets.
2) Can I set a time limit to where posts enter an archive after a certain peroid of time, removing them from the front page?
No there is not. The archive is not really an archive in the true sense of the word and is more of a date-based listing. As you create more posts, the oldest post on the main page will be bumped off of that page and onto the second page.
3) Is there a way to remove the line (features date) above the posts? Either remove altogether, or just keep it as a line and make the date disappear?
.post-date a { display: none; }4) Is there a way to constrain the page width to the browser? I’m on Google Chrome and have my zoom at 100% and I have to slide over on the page a little bit (not much) to get full width.
It would take a good deal of thought and work to turn Manifest into a responsive width theme, but we can give this a try. See what you think.
.blog #site-wrapper, .blog #core-content, .blog #footer { box-sizing: border-box; margin-left: auto; margin-right: auto; max-width: 1200px; min-width: 600px; width: 100%; } .blog #site-wrapper { padding-left: 50px; padding-right: 50px; } -
-
-
Ah, one section is in a different div, so we need to modify the CSS selectors. On this selector for this rule,
.blog #site-wrapper, .blog #core-content, .blog #footer
change it to this.
.blog #site-wrapper, .blog #core-content, .blog #footer, .blog .infinite-wrap -
I think that worked. When you click “Read More,” do the new articles that pop up appear to shift right?
For example, can you see the difference in space in the gaps between the articles? How one is wide and the other is narrow? This happens (at least for me on Chrome) when I scroll down past these posts AFTER hitting “Read More.” See below:
WIDE: https://drive.google.com/file/d/0BwKoKk2UNznUTUxNZ3N1c2doRm8/view
NARROW: https://drive.google.com/file/d/0BwKoKk2UNznURTE3QWJjRlZIeFk/view
-
Hmmm, I’m not seeing any “read more” buttons or links on the posts on your main page, they all take me offsite to other sources.
I’m also not seeing any of the code I had given in your site right now, so I can’t see what is causing the perceived shift. I would expect it is a padding or margin issue, or perhaps there is a float that is causing things to align to the left instead of it being centered.
-
Sorry. Not “Read More,” i meant to say the “Older Posts” button. Also, I have included all of the code you gave me. So I have no idea why it wouldn’t be showing up..
-
I see this in your custom CSS
.blog #site-wrapper,.blog #core-content,.blog #footer { width:1200px }but what I do not see is this, which does the semi-responsive thing.
.blog #site-wrapper, .blog #core-content, .blog #footer, .blog .infinite-wrap { box-sizing: border-box; margin-left: auto; margin-right: auto; max-width: 1200px; min-width: 600px; width: 100%; } .blog #site-wrapper { padding-left: 50px; padding-right: 50px; }Add the above at the very end of your custom CSS and the find this
.blog #site-wrapper,.blog #core-content,.blog #footer { width:1200px }and delete it.
-
-
-
One more question…
Is there a way to reposition a post that I “sticky” to a separate line above the other posts? Similar to the way http://www.drudgereport.com does it
-
I don’t know whether we’d be able to get them on a separate line in this theme, but if you want to go ahead and make a few sticky posts, we can help you find ways to make them stand out.
-
-
You may be able to do that with CSS, though most browsers discourage it.
I recommend searching “How to make text blink with CSS” and reading some of the discussions and ideas around that.
-
-
Here’s how you can do it but be warned it’s pretty bad form to flash text on your site (it’s a bit like auto-playing music to your visitors), I’ll leave the choice up to you though!
@keyframes annoyingflash { from {color: #00000;} to {color: #A63E06;} } #site-description { animation-name: annoyingflash; animation-duration: 0.5s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease; } -
-
-
Thanks @hallluke :) The other hacks I could think of had all been disabled by Chrome.
@zacheryhenry in this case he singled out #site-description. If you want to single out something else, try using Chrome to right-click and choose “Inspect Element” … you may be able to discern its class or ID there.
Then you would substitute the #site-description part of the code Luke sent for #idname or .classname — hope that helps. We have more CSS tips here:
- The topic ‘Edits to homepage/news feed structure (cont)’ is closed to new replies.
WordPress.com Forums 