Red Folio Theme – Change Font
-
Hi Anyone can help?
Tried to change the own font “Gotham”, we do have licenses and custom css key as setup
– Theme Options -> Custom css ->After, I have change the style.css
/* O. CSS RESET --------------------------------------------------------------*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } :focus { outline: 0; } /* END CSS RESET -------------------------------------------------------------*/ /* 2. TYPOGRAPHY ------------------------------------------------- */ html { height: 100% } body { font: 16px/24px "Gotham SSm A", "Gotham SSm B"; font-weight: normal; height: 100%; color: #4a4c4e; } p { margin: 24px 0; line-height: 24px; font-size: 16px; position: relative; } a, a:link, a:focus, a:active { outline: 0; text-decoration: none; } p a, .slide-description a, .home-subtitle a { border-bottom: 1px solid #ccc; } a img { border:none; vertical-align:top; } h1, h2, h3, h4, h5, h6, .details, .dropcap, ul.tabs li a { font-weight: 900; font-family: Lato, "Helvetica Neue"; } h1, h2, h3, h4, h5, h6 { color: #2a2c2e; letter-spacing: 2px; } .home-content h1, .home-content h2, .home-content h3, .home-content h4, .home-content h5, .home-content h6, .home-content h1 a, .home-content h1 a:link, .home-content h1 a:visited, .home-content h2 a, .home-content h2 a:link, .home-content h2 a:visited, .home-content h3 a, .home-content h3 a:link, .home-content h3 a:visited, .home-content h4 a, .home-content h4 a:link, .home-content h4 a:visited, .home-content h5 a, .home-content h5 a:link, .home-content h5 a:visited, .home-content h6 a, .home-content .home-content h6 a:link, h6 a:visited, .home-content p { color: #fff; } h1, h2, h3, h4, h5, h6 { clear: both; position: relative; margin: 24px 0; padding: 0; line-height: 24px; } h1 { font-size: 38px; line-height: 44px; font-weight: 900; } h2 { font-size: 32px; line-height: 40px; font-weight: 900; } h3 { font-size: 28px; line-height: 36px; } h4 { font-size: 24px; line-height: 32px; font-weight: 700; } h5 { font-size: 20px; line-height: 28px; font-weight: 700; } h6 { font-size: 16px; line-height: 24px; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; } .slide-title, .home-title { font-size: 80px; line-height: 1em; text-transform: uppercase; letter-spacing: 8px; padding-left: 8px; color: #1a1c1e; text-align: center; display: block; margin-top: 0; font-weight: 700; } .slide-title { margin-top: -12px; margin-bottom: 20px; } .home-subtitle { letter-spacing: 1.2px; margin-top: 14px; font-size: 20px; } h1.blogtitle, .portfolio1 .posttitle { font-size: 16px; line-height: 24px; clear: none; font-weight: 900; text-transform: uppercase; letter-spacing: 2px; top: -2px; margin-top: 0; word-wrap: break-word; -ms-word-wrap: break-word; } h1.pagetitle { font-size: 60px; line-height: 1.1em; top: -12px; left: 0; margin-bottom: 28px; margin-top: 0; clear: none; font-weight: 900; text-transform: uppercase; text-align: center; } h1.single-blogtitle { font-size: 60px; line-height: 1.06em; top: -10px; margin-top: 24px; clear: none; font-weight: 900; text-transform: none; } h1.single-portfolio { font-size: 38px; line-height: 44px; margin-top: 0; top: -3px; clear: none; font-weight: 900; text-transform: uppercase; } h2.single-portfolio { font-size: 16px; line-height: 24px; text-transform: uppercase; letter-spacing: 3px; margin-top: -24px; margin-bottom: -24px; top: -3px; clear: none; font-weight: 200; color: #999; } h2.searchresults { font-size: 16px; line-height: 24px; top: 0; text-transform: uppercase; background-color: #e4e4e4; text-align: center; padding: 4px; font-weight: normal; letter-spacing: 2px; margin: 48px 0 24px 0; font-weight: 700; } .portfolio-section h1.posttitle { margin-top: 0; font-weight: 700; } h3.widgettitle { margin: 0px; text-transform: uppercase; color:#505254; font-size:13px; line-height: 16px; position: relative; font-weight: 900; letter-spacing:1px; padding:0px 2px 4px 0; } .dash { letter-spacing:-3px; } #sidebar .dash { margin-top: 8px; } .round { border-radius: 999px; } a:link, .content a:visited, .content a:active, .button1, .buttonS, .button1:hover, .buttonS:hover, .event-more-info, a:hover .lastfm, li.comment .reply, .login-submit input, .sf-menu li:hover, .sf-menu li.sfHover, .sf-menu a:focus, .sf-menu a:hover, .sf-menu ul a:hover, .clientlogos li a img, .socialicons i, a.pp_previous i, a.pp_next i { -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } ul, ol, dl, dd, blockquote, address, table, fieldset, form, .gallery-row { margin: 20px 0; } .small { font-size: 10px; } strong { font-weight: 900; } address, em, dfn, cite, var { font-style: italic; } dfn { font-weight: bold; } del, strike { text-decoration: line-through; } ins { text-decoration: none; border-bottom: 1px dashed #ccc; } sup, sub { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } blockquote, q { quotes: none; margin-left: 24px !important; border-left: 4px solid #ddd; padding: 1px 20px; font-size: 18px; top: -2px; position: relative; clear: none; font-size: 16px; line-height: 32px; top: -2px; position: relative; clear: none; color: #888; text-transform: uppercase; letter-spacing: 3px; } blockquote p { color: #6a6c6e; font-weight: 100; margin: 12px 0; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } blockquote.left { margin-right: 20px; text-align: left; margin-left: 0; width: 33%; float: left; } blockquote.right { margin-left: 20px; text-align: right; margin-right: 0; width: 33%; float: right; } cite { font-size: 12px; text-transform: none; letter-spacing: 0; color: #808080; } dt {font-weight: bold;} abbr, dfn, acronym, acronym { cursor: help; } textarea, input { font-family: "Gotham SSm A", "Gotham SSm B"; font-size: 13px; -webkit-border-radius: 0; } textarea { overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */ vertical-align: top; /* Improves readability and alignment in all browsers */ } tt { font-family: Courier, serif ; } pre, code, kbd { font-family: Courier, serif ; font-size: 15px; white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } pre { display: block; font-size: 14px; margin: 24px 0; padding: 18px 20px; background-color: #eee; color: #777; } ul, ol {margin: 24px 0 24px 18px;} ul li, ol li ul li {list-style-type: disc;} ol li, ul li ol li {list-style-type: decimal;} .single-blog-content li, .portfolio-content li {margin-top: 12px;} table { margin: 0; width: 100%; } table th, table td { padding: 12px 24px 12px 0; line-height: 19px; text-align: left; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } table th { font-weight: bold; } /* END TYPOGRAPHY ----------------------------------------------- */
but at the end, it’s wasn’t show the correct font, it seem like the Times New Roman Font.
here is the site: https://wp.ledingray.com/
Please Any tips appreciated! I’m fairly new to css tinkering.
- The topic ‘Red Folio Theme – Change Font’ is closed to new replies.