remove opacity from blog page
-
Hi, the theme is great! Just wondering how to remove the opacity from both the text and image from the blog page. I can’t seem to figure it out. Also how do you remove the author link, but keep the date and category link on the blog page?
-
Hi emmatoria,
First: to remove the opacity from both the text and the image from the blog page, you have to change the css file style.min.css on your theme,
you can acces via ftp or through wordpress using this url
https://(yoursiteurl)/wp-admin/theme-editor.php?file=style.min.css&theme=tracksonce you have the file you search for:
.excerpt{-webkit-transform:translateZ(0);transform:translateZ(0);position:relative;clear:both;padding:0;margin-bottom:1.5em;opacity:1;-webkit-transition:opacity .2s ease;transition:opacity .2s ease;-webkit-backface-visibility:hidden;backface-visibility:hidden}
and chance opacity:0.8; to -> opacity 1
2nd). To remove the author link you can do it with css (will hide the author) or you can remove it from the php file.
to do it with css you will make it adding at the bottom/end to the file we modified in the step above style.min.css the following css rule:.excerpt-meta .author{ display:none; }
if you only want to remove the author name from the home page add the body.home before the rule
body.home .excerpt-meta .author{ display:none; }
With Php (this will only remove it from the home page), you have to find the file content.php (line70) of your theme
you can find it in this url:https://(yoursiteurl)/wp-admin/theme-editor.php?file=content.php&theme=tracks
look for :
<div class=”excerpt-meta”>
<span class=”date”><?php echo get_the_date(‘F j’); ?> / </span>
<span class=”author”><?php the_author_posts_link(); ?> / </span>and just remove the “
<span class="author"><?php the_author_posts_link(); ?> / </span>
” or just comment it<!-- <span class="author"><?php the_author_posts_link(); ?> / </span> -->
I hope you can solve it!
Hernan
@wpmu DEV – Support Why are you suggesting to edit the theme files? And editing PHP files from the dashboard is just a bad idea.
@emmatoria If you edit the theme files, you won’t be able to update Tracks without losing your changes. Tracks has already been updated many times, and will be update many more with bug fixes and new features.
I’ve put together a child theme for you that will remove the opacity and also remove the author link the proper way. You can download it here.
Follow these steps to activate it:
- Visit your site’s dashboard
- Go to the Appearance menu
- Click on the “Add New” button at the top of the page
- Click on the “Upload Theme” button at the top of the page
- Click on the “Choose File” button
- Select the tracks-child.zip file you downloaded from the link above
- Click the blue “activate” link
Once activate the changes should take place immediately.
@emmatoria, @bem sibley is right, the best way to apply the changes is in your child theme, I thought you were working in a child theme.
Regarding the use of the dashboard to modify the code, there are no specific issues with it. It’s just a matter of keep your site working if something fails when you edit. If you have the chance to use a code editor and upload the files via FTP, that’s definitevely the recommended way. If you have no option or just want to make a quick change, it’s ok to use the dashboard, but always keeping a backup of your files just in case.
Cheers
Hernan
Hi Ben,
1. If I want to remove the opacity (but leave in the author bit), what code from the file above should I eliminate?
2. Can I amend the above “content.php” file to include additional changes to php(adding year to date at top of each post, adding copyright info to site footer, removing some of the padding around Post page widgets at bottom) – or should I create a separate file for those items? I’ve already got a child theme uploaded with changes I made to style.css.
1. If I want to remove the opacity (but leave in the author bit), what code from the file above should I eliminate?
The
style.css
file can remain the same just remove thecontent.php
file.2. Can I amend the above “content.php” file to include additional changes to php(adding year to date at top of each post, adding copyright info to site footer, removing some of the padding around Post page widgets at bottom) – or should I create a separate file for those items? I’ve already got a child theme uploaded with changes I made to style.css.
I would copy the
content.php
file into your child theme (not the one here, the one currently being used on your site).Then, you could adjust the date format in the child theme’scontent.php
which will be loaded instead of the parent’s.You can do the same thing with the
footer.php
file to add a copyright. Copy it from your version of Tracks and the child theme’sfooter.php
will be loaded instead. Lastly, the padding around the widgets can be handled from the child theme’sstyle.css
file.That’s the overview of how it can be done. If you need any specific implementation details just let me know.
Hi Ben,
Thanks for the tips. I managed to update the opacity via style.css and add/update both the footer and content.php files.
I’ve already adjusted the padding above and below the widgets, but am stuck on the following:
a. The padding between the two widgets is still too high and I can’t figure out where it is on the style sheet.
b. I’d like the Get Email button to line up with the Go button above it and can’t seem to make it work.a. The padding between the two widgets is still too high and I can’t figure out where it is on the style sheet.
The widgets themselves have no margin or padding, so this means an element inside the widget must be responsible. I tried out a few different widgets, but they all appeared very close together. Is it a particular widget causing the gap?
b. I’d like the Get Email button to line up with the Go button above it and can’t seem to make it work.
It depends on what widget you’re using, but I’m almost certain the issue is
display: block;
. Check if the inputs are contained inside <p> tags and if they are, set those paragraphs todisplay: inline-block;
to allow them to sit next to each other.As a quick aside, have you tried using your browsers developer tools? If not, it will help you tremendously in tracking down the specific style rules you need to change. You can right-click an element on the page and select “Inspect Element” to check it out with the dev tools.
Thanks, Ben. Yes, I have been using Firebug – it’s been a great help (along with you, of course!).
It’s the search widget and subscription widget I am using on post pages – scroll down to very bottom of the page.
Aha, the culprit is the search form container:
#tracks-child .widget .search-form-container { margin-bottom: 0; }
That should do the trick!
I was so close – missed the .widget bit before search form container. Thanks Ben – fixed most of the spacing/padding issues now.
Still can’t figure out why search submit and email submit buttons don’t line up. Also can’t figure out why I can’t change padding below entry-meta-bottom float. Promise this is the last time I bug you!
haha sure thing ??
The following code should do the trick:
.jetpack_subscription_widget p { display: inline-block; } .jetpack_subscription_widget #subscribe-email { width: 80%; max-width: 24em; }
The first part sets the paragraphs containing the inputs to be inline-blocks so they can sit next to each other. The second part is a responsive approach to sizing the email input, and should make it roughly the same length as the search input above it.
Let me know how that works for you.
Thank you, Ben. I added that in and had to make a few additional adjustments to each widget field and both button dimensions…but got it to work in the end.
I have to say overall that your theme is really flexible when it comes to making css changes. I am new at this, and have found it a pleasure to work with compared with a few other themes I’ve used (for different sites).
Stellar support here, too. ?? Much appreciated.
Yea no problem. Glad the updates are working for you!
It can be tough at times, but I try to keep things as simple as possible. There are certainly some complex themes out there.
Would you mind doing me a favor and leaving a review for Tracks? I would greatly appreciate it.
Done!
- The topic ‘remove opacity from blog page’ is closed to new replies.