[joemagpie]

Hi I just applied your ‘the Blogger’ theme and am trying to adjust some points to look better to me. I have lots of question and hope you could help me out.

1. Blog listing
a. On mobile version, title font size is too big and there is line break. I don’t want to have 2 lines of title. How can I fix this?
b. On desktop version, I want to have smaller thumbnail. How can I reduce image size?
c. I want to have thumbnail and content aligned at top on same level. Pls help.
d. How can I insert thin (1px) divide line between postings? (100% length of content)
e. I want to move ‘read more’ button to right side of contents and less spacing between content and the button.
2. Single posting comment section
a. I already changed the setting of avatar not to show on comment section, but am still seeing huge space in front of comments. How can I move them to left side?
b. How can I reduce space between content and comment section?
c. Previous/next post layout: I want to align img and text at top.
d. How can I remove thick outline border around comments # and add underline instead?
e. I want to reduce spacing between comment and reply around 50%.
f. How can I insert thin (1px) divide line between comments (not including reply)? (100% length of comments)
g. How can I remove tab image at the right side of comments?
h. When logged in, I see yellow box saying ‘logged in as **. Log out?’. How can I change the color of block?

Thx a lot in advance! Attached image links that might help your understanding.
https://drive.google.com/open?id=10G-EIAlm9kGNV8V45AMeNZSVLfQJeY8i
https://drive.google.com/open?id=1jksnCnEqELGygCfDhrL7Fng_IZO6aTWb
https://drive.google.com/open?id=1Y4PeeMxSbzn0mDM-84eMwbS_8ncl3w5l
https://drive.google.com/open?id=1RZPGbL0CjzwDxgSlc3bqwTpgOk7Fx0P7

Thx and regards,
Joe

[serkan]

Hi,
I wish you hadn’t asked all the questions under one topic. Because it will be difficult for people with similar questions to find their answers. Also, please provide me your related url so it will be much easier to find a solution for you.
1a. You can use this custom css code;

@media screen and (max-width: 767px) {.is-header-small .site-branding { max-width: 90%; } }

1b. You can use this custom css code to have smaller thumbnail on the blog list.

@media screen and (min-width: 992px) {
.blog-list .featured-image { width: 30%; padding-top: 30%; } }

1c. You can use this custom css code;

@media screen and (min-width: 768px) {
.blog-list .hentry-middle { padding-top: 0 !important; } }

1d. You can use this custom css code;

@media screen and (min-width: 768px) {
.blog-list .hentry {  border-bottom: 1px dotted; padding-bottom: 3em; } }

1e. You can use this custom css code;

.more { text-align: right; }
a.more-link { margin-top: 0 !important; }

Lets find a solution for the others. But firstly, provide me your related url for the single posting section.
Thanks

[joemagpie]

Hi ,
Thx so much for reply and sorry to put all questions in one post.
Next time i will make sure to post one by one.

My site is https://joemagpie.blog/
Will await single post section.

I tried all answers above and 1b and 1e don’t work.
Hope you can help again.

Thx,
J

[serkan]

Hi,
I just tested the custom css code for 1b and 1e on your website and they are working well. And i didn’t see this custom css code in your custom css box. Please try it again. And clear the browser cache, please.
2a) You said that you removed the avatar on the comment section. There is no space left in the avatar part.
2b) You can use this custom css code;

.nav-single { margin: 0; }

2c)

.nav-single .nav-desc { margin-top: 0; }

2d)

.is-widget-first-letter-border .site-main .widget-title span:first-letter { border: none; border-bottom: 2px solid; }

2e)

.comments-area article { padding-bottom: 0px; }

2f) We cannot avoid from reply button. It could be like this;

 .comments-area article { border-bottom: 1px solid; margin-bottom: 20px; }

You can go to appearance > customize > single post > you can customize the comments section from here. Maybe you will like other styles and you won’t need to use custom css code.
Only you can see the log in and logout section so you don’t need to change the color.