Dyad 2 By Automattic : Modifications, Support and documentations
November 13, 2017 69 Comments
Dyad pairs your written content and images together in perfect balance. The theme is geared towards photographers, foodies, artists, and anyone who is looking for a strong photographic presence on their website. You can check Demo of Dyad 2 by Automattic.
If you are using wordpress.com business plan or want to use the dyad2 theme in your hosting you can download the parent and child theme from below links
Dyad 2 By Automattic Parent Theme Download
Dyad 2 By Automattic Child Theme Download
You can ask question regarding any issue you are facing.
Or can take my personal help.
Question 1 : To change hover border color from light grey to different color in dyad 2 theme by Automattic
.home a.cover-link:hover {
border-color: red !important;
border-width: 11px !important;
}
Question 2: Homepage Read More button hover background color change
.home .posts .hentry:hover .link-more a {
background-color: red !important;
}
Question 3: Homepage Read More button background color, font size, font family
.home .posts .hentry .link-more a {
background-color: darkred;
color: white !important;
font-size: 12px !important;
font-family: cursive;
}
Question 4 : To change homepage posts title font color, font size and font family
.posts .entry-title, .posts .entry-title a {
font-size: 3.0rem;
color: darkred !important;
font-family: cursive !important;
}
** In single post page, to change post title’s font color, font size and font family
.single-post h1.entry-title {
color: yellow !important;
font-size: 32px !important;
font-family: cursive !important;
}
Question 5: How to change post content’s color, font size and font family from light grey to black
.entry-content {
color: black !important;
font-size: 16px !important;
font-family: cursive !important;
}
** this code is applicable for single post page too
Question 6: If you want to remove or want to make the light grey background of header menu section to be transparent
header#masthead {
background: transparent !important;
}
*** to use different background color without opacity try the code below
header#masthead {
background: red !important;
}
Question 7 : How to change the font size, color and font family of top menus
#site-navigation a {
color: #fff;
font-family: cursive !important;
font-size: 14px !important;
}
Question 8 : How to change drop down menu (child menu) black background color to different one
#site-navigation ul ul li {
background: darkred !important;
}
#site-navigation ul ul:before {
border-color: transparent transparent darkred transparent;
}
Question 9: How to change site title’s font color, font size and font family
header .site-title a {
color: yellow !important;
font-size: 34px !important;
font-family: cursive;
}
*** To change hover font color of site title
header .site-title a:hover {
color: red !important;
}
Question 10 : How to change footer widget section background color
.site-footer {
background-color: darkred !important;
}
Question 11 : To make the footer widget title centered, applying a background behind title, to change widget title’s font color, font size, font family, using border
Answer: use the following code
footer h3.widget-title {
color: white !important;
font-family: cursive;
font-size: 18px !important;
background: red;
text-align: center;
border-bottom: 1px solid white !important;
}
Question 12: To change footer widget’s links font color, font size and font family
footer .widget-area a {
color: white !important;
font-size: 14px !important;
font-family: cursive;
}
** to change footer widget’s links hover font color
footer .widget-area a:hover {
color: red !important;
}
Question 13: If you don’t want to show post date, category name, tags, author etc also want to show or hide featured image in posts, pages etc
Answer: Go to dashboard, then Appearance > Customize > Content Option and tick the options as per your choice
Question 14: To change footer copyright info without using any pluigns
Answer: Go to dashboard, then Appearance > Editor (theme editor). Follow the screenshot below
** do the change in child theme
Question 15: To change footer copyright info font color, font size and font family
.site-info a {
color: white !important;
font-size: 18px !important;
font-family: cursive;
}
*** to show the footer copyright text centered
.site-info {
display: block;
float: none !important;
text-align: center;
}
Question 16: To change footer copyright section background color
.footer-bottom-info {
background-color: darkred !important;
font-size: 1.4rem;
padding: 3rem 5.5rem;
}
Question 17 : To change the width of single page
body:not(.has-post-thumbnail).is-singular .entry-inner {
max-width: 1200px !important;
}
Question 18 : To reduce gap between top header and Page title
.is-singular div#content {
padding-top: 100px !important;
}
Question 19 : To reduce gap above and below of Page title
.is-singular:not(.home):not(.page-template-eventbrite-index) .entry-header {
padding-top: 12px !important;
padding-bottom: 12px !important;
}
If you have any issue feel free to ask me question here in comments section
OR
Pay me some, I will help you for CSS Issue Personally CLICK HERE….
Om Prakash Chowdhury
Great guide, thank you so much! I’m just wondering now, how to change the colour of the button that says “featured”?
LikeLike
Hi
please share me your site url to check
Om
LikeLike
Hi! Is it possible to have three instead of two posts next to each other or that the panels consisting of text and picture can be made a bit smaller in general? Greetings!
LikeLike
HI
would you mind to try this first please?
@media only screen and (max-width: 1600px)
{
.posts .hentry {
width: 33.322% !important;
}
}
LikeLike
Hi,
my problem is if I share my page to fb or google no photo apperars. (I have no static front page.) Could you pls help? Thx!
https://clumsykitchensite.wordpress.com/
LikeLike
HI, which page u tried to share in facebook? share me that page link
Om
LikeLiked by 1 person
This: https://clumsykitchensite.wordpress.com/ When I share a blog post, it works properly, only the page’s link not.
LikeLike
Please try again now..it will work now 🙂
Om
LikeLiked by 1 person
What have you done? Magic! It works! Many thanks!
Eni
LikeLike
Pleasure Ani 🙂
LikeLike
Hi Om!
You’re doing a great job, thank you very much! Could you please help me to change space around “Previous post” and “Next post” at the bottom of a single page. Also there is a line with a dot, just above these two that could be move w little up. Thanks a million!
LikeLike
HI Rolandrolson
are you using wordpress.com free plan?
please let me know
Om
LikeLiked by 1 person
I moved to a different hosting provider, but I was on that free plan in the past.
LikeLike
In such case share me the site or post url to check please 🙂
LikeLike
http://rolandrolson.eu , any post will show you what I am trying to change. Thanks very much!
LikeLike
HI Rolandrolson
try this code
.single #jp-relatedposts {
margin-bottom: 1px !important;
padding-bottom: 0px !important;
}
.single article {
padding-bottom: 0px !important;
}
.post-navigation .nav-previous, .post-navigation .nav-next {
padding-bottom: 20px;
}
.is-singular .post-navigation .nav-links {
margin: 1em auto 0 !important;
padding: 1em 0 !important;
}
.post-navigation .nav-previous, .post-navigation .nav-next {
padding-bottom: 0px !important;
}
hope that helps
Om
LikeLike
Om, thank you very much for your help. The code did the magic, the website looks much better! You’re a star! Thanks again! 🙂
LikeLike
Hi Om,
Is it possible to have width of image more than width of column. For example, I have put width of single page 1000px as per Code #17 above and I want to have image width of 1200px on those pages.
LikeLike
please share me the page url where you want to do that change
Om
LikeLike
Hi! Is there a fix that makes a category’s or tag’s description visible on the first page, but not on page 2, 3 etc?
LikeLike
HI Gjermund Glesnes
Would u mind to clarify some more?
sorry didn’t understand your issue
Om
LikeLike
I use 24 posts per page on my category and tag pages. If the category has more posts, they will show up on /Page/2/, /Page/3, etc.
To improve my search rankings for the category pages I have started to write better descriptions, up to 300 words for each. However, the Dyad 2 theme by default shows the same description on all of them – making for duplicate content and poor usability.
LikeLike
let me check
share me any of your category or tag page where /Page/2/ showing
Om
LikeLike
https://detvondeliv.no/europa/
https://detvondeliv.no/europa/page/2
LikeLike
HI Gjermund Glesnes
try this
.archive.paged .taxonomy-description {
display: none !important;
}
let me know if it helps
Om
LikeLike
The code was
/*hide taxonomies description from paged archives*/
body.tag.paged .taxonomy-description, body.category.paged .taxonomy-description{
display: none;
}
LikeLike
Ok great..that should work too 🙂
LikeLike
Hi, Im totaly new in wordpress and need some help in customizing your theme. Its beautifull and brings my blog to entire new high-class level but want to made some tweaks:
1. how to change number of columns from 3 to 2? in live demo on my screen i can see 2 columns of pictures but after enabling theme my site got 3 columns. can you help?
2. where to appy all those changes you highlighted in list above? apperance–>editor? which option to select and where to put those codes you highlighted in points:4/5/9? cannot find them.
thanks a lot for help! youve done great work so far!!!
LikeLike
Hi Rafal
sorry for the late response, was busy with some personal matter.
are you using wordpress.com ?
please let me know
Om
LikeLike
Also, it is showing 2 column in your homepage?
LikeLike
HI, my blog is http://www.bezwegli.pl. Im using it directly from wp-admin.php panel but Im register on wordpress.com . on my homepage I got 3 columns but would like to have just 2. thanks for any hints how and where to apply your code
LikeLike
Hi Rafal
what is your screensize?
it is showing 2 column in my end?
please let me know
Om
LikeLike
Hi, my screensize is 1366×768 . the reason I was confused is that on live demo its showing 2 columns on full screed byt after implementation its showing 3.
what about those code changes? also I saw that in demo you got auto hidding on main menu on top of the page and cannot find this option in setup
thanks
Rafal
LikeLike
Hi Rafal
sorry seems i am not getting your issue,
would you mind to share me screenshot how it is looking in your end please?
LikeLike
Hello! I need yto change the site description font size. Thank you
muriellesisaket@gmail.com
LikeLike
HI Murielle
would you mind to share me your site url to check please?
Om
LikeLike
Hi Om, Would it be possible to add a sidebar to the pages? I like the post layout, but I need sidebar for pages.
Julie
LikeLike
Hi Julie
yes possible
but are you using wordpress.com free or premium plan?
please let me know
Om
LikeLike
I have a few things I need. If you can do a sidebar and change some font size/color, I’d be happy to set up a fiverr.
LikeLike
THanks
sorry for the late reply
would u mind to tell in which page u want to create sidebar?
Om
LikeLike
I have my own domain http://best-of-sacramento.com
self-hosted wordpress.org
LikeLike
Hello! I’m also new in WordPress and have just started a blog using this theme. But, for some strange reason, the set up automatically made my Home a page where the posts do not appear, and I think it seems weird… here it is: https://frombraziltoitaly.wordpress.com/
How can I set this page as my home instead? -> https://frombraziltoitaly.wordpress.com/blog/
Thanks for any help you can give me!!
LikeLike
Hi Cerri
https://frombraziltoitaly.wordpress.com/wp-admin/options-reading.php
check “Your homepage displays” option
Om
LikeLike
Amazing! Thank you!
LikeLike
Hey Om, I have a issue with the balance between picture and text. Out of the sudden from one blog entry it changed and now the balance is gone. Could you help me with that?
I also use the wordpress free plan and the name is: travellingforlifeblog.wordpress.com
I also have one more question about the size from the blogposts. I love the view with two or three posts in a row but on my tablet or especially on the phone the posts are just in a column. Can I change that somehow?
Thanks a lot for your help (:
LikeLike
Actually in free plan you can’t use any css or others
😦
Om
LikeLike
Is there no possibility to get the balance back /: ?
LikeLike
have u checked your Visual and Html editor options of that post?
LikeLike
Yes but I cannot find the option to change the position or the side of the picture and the text. I think I remember that you could change that somewhere but I cannot find it anymore..
LikeLike
would you mind to share me the page or post url where the image and text alignment disturbed please?
Om
LikeLike
Sure, its travellingforlifeblog.wordpress.com
After 6 blog posts the balance is disturbed from one post. It does not matter which one because I already tried to take that post and tag it as the first post on the website but then just another blog post disturbs the balance. I checked if that is maybe the „next page“ that it is like starting over again but in my settings it says to show 20 posts per page and I just have 14.
Thanks for trying (:
LikeLike
just checked
it seems Ok to me?
LikeLike
Okay weird, on my tablet it is shown different. Can I send you somehow a screenshot?
LikeLike
yes..share me screenshot please
Om
LikeLike
Okay, how can I send it to you. WordPress does not give me the option to send any pictures
LikeLike
It is just visible if you zoom that far that you can just see one blog post in a row, the second is underneath and so on. If you have two posts in a row it does not appear
LikeLike
Hi
just upload the image in your media library and share me the url here
Om
LikeLike
https://wordpress.com/media/travellingforlifeblog.wordpress.com
Thanks, I uploaded two pictures. The first one how it should be and the second how it is
LikeLike
https://i2.wp.com/travellingforlifeblog.files.wordpress.com/2018/09/df7b2d12-7bcd-4379-b340-dc90be10d3c5.png?ssl=1&w=450
LikeLike
https://i2.wp.com/travellingforlifeblog.files.wordpress.com/2018/09/df7b2d12-7bcd-4379-b340-dc90be10d3c5.png?ssl=1&w=450
That it how it looks but it should be the text from the next blog underneath the picture… sorry for the confusing comments and the wrong link first
LikeLike
thanks
you shared same image 2 times?
sorry didnt understand the issue actually
😦
Om
LikeLike
I‘m sorry for the confusion 🙈🙈🙈
Okay I‘ll send you two images. The first how it should look like snd the second how it actually looks like.
First one: https://i2.wp.com/travellingforlifeblog.files.wordpress.com/2018/09/6be591ed-2a62-4fad-a382-f926feb4e5ec.png?ssl=1&w=450
Second one: https://i2.wp.com/travellingforlifeblog.files.wordpress.com/2018/09/df7b2d12-7bcd-4379-b340-dc90be10d3c5.png?ssl=1&w=450
LikeLike
thanks
sorry for the late
the image and content alignment ( to show images in the left and content to the right) can be changed
but in free wordpress.com site…i am afraid you can’t change that as it will need css to use
Om
LikeLike
Is there no option in the settings or something?
LikeLike
Umm no i think
LikeLike
…
okay.. thanks anyway
LikeLike
Hello, Could you advise how to allow comments aganst a blog post. I have allowed them in settings but they do not fnction on the site.
LikeLike
Hi
in which site you are working on?
would u mind to share me the site URL please?
Om
LikeLike
My site is http://www.sprucingthegoose.com. However, problem has resolved: I refreshed and deleted cookies in the (Opera) browser and coments appeared.
LikeLike