Dyad 2 By Automattic : Modifications, Support and documentations

dyad2 by Automattic documentation and tutorials

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;
}

dyad2 by Automattic homepage posts border readmore and style change

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;
}

dyad2 by Automattic header menu site title modifications

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;
}
dyad theme footer widget section modification
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

Hide or remove category tags author and show featured image

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

dyad theme footer copyright info change without using plugins

 

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;
}
footer copyright section modification

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;
}
dyad2 by Automattic single page modifications

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….

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: