How to change h1 font size on homepage
I want to change the font size of my h1 tag on the homepage. I am using Chrome inspect and it tells me the css changes are actually inside the page itself, not css. So I look at source code:
/* Theme Fonts Settings */
.page-title h1,
.page-title h2,
.page-print h1
{font-family: 'Open Sans';}
.page-title h1,
.page-title h2,
.page-print h1
{ color: FFFFFF;}
I want to make it large by adding a font-size command.
How do I access this via FTP to edit it? I been looking at through all /app/design/frontend/npdiploma/default/layout/
files and /template/
files and can't find anything related to this.
Normally I just edit media/css_secure/
files but this seems embedded into the actual page.
css fonts
bumped to the homepage by Community♦ 8 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
I want to change the font size of my h1 tag on the homepage. I am using Chrome inspect and it tells me the css changes are actually inside the page itself, not css. So I look at source code:
/* Theme Fonts Settings */
.page-title h1,
.page-title h2,
.page-print h1
{font-family: 'Open Sans';}
.page-title h1,
.page-title h2,
.page-print h1
{ color: FFFFFF;}
I want to make it large by adding a font-size command.
How do I access this via FTP to edit it? I been looking at through all /app/design/frontend/npdiploma/default/layout/
files and /template/
files and can't find anything related to this.
Normally I just edit media/css_secure/
files but this seems embedded into the actual page.
css fonts
bumped to the homepage by Community♦ 8 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
I want to change the font size of my h1 tag on the homepage. I am using Chrome inspect and it tells me the css changes are actually inside the page itself, not css. So I look at source code:
/* Theme Fonts Settings */
.page-title h1,
.page-title h2,
.page-print h1
{font-family: 'Open Sans';}
.page-title h1,
.page-title h2,
.page-print h1
{ color: FFFFFF;}
I want to make it large by adding a font-size command.
How do I access this via FTP to edit it? I been looking at through all /app/design/frontend/npdiploma/default/layout/
files and /template/
files and can't find anything related to this.
Normally I just edit media/css_secure/
files but this seems embedded into the actual page.
css fonts
I want to change the font size of my h1 tag on the homepage. I am using Chrome inspect and it tells me the css changes are actually inside the page itself, not css. So I look at source code:
/* Theme Fonts Settings */
.page-title h1,
.page-title h2,
.page-print h1
{font-family: 'Open Sans';}
.page-title h1,
.page-title h2,
.page-print h1
{ color: FFFFFF;}
I want to make it large by adding a font-size command.
How do I access this via FTP to edit it? I been looking at through all /app/design/frontend/npdiploma/default/layout/
files and /template/
files and can't find anything related to this.
Normally I just edit media/css_secure/
files but this seems embedded into the actual page.
css fonts
css fonts
edited Feb 13 '17 at 3:39
Adarsh Khatri
6,67111643
6,67111643
asked Feb 13 '17 at 1:11
James SonnyJames Sonny
2115
2115
bumped to the homepage by Community♦ 8 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
bumped to the homepage by Community♦ 8 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
James, your question is too generic and does not apply to Magento directly. You are probably using a 3rd-party theme which is hard to support in a forum like this. That said, I can tell you what Magento developers typically do to track down this kind of information.
How do I locate inline CSS in Magento?
If the CSS is truly inline somewhere, it's probably in any of 3 places:
- Layout XML [ reference ]
app/design/frontend/[package]/[theme]/layout
- Templates (PHTML)
app/design/frontend/[package]/[theme]/template
- System Configuration
- System > Configuration > General > Design > HTML Head > Miscellaneous HTML
- System > Configuration > General > Design > Footer > Miscellaneous HTML
Searching the code base
To find your code for #1 or 2, use a tool like grep
(Unix) or findstr
(Windows), searching over an entire folder. Here's an example for Unix systems:
grep -rn 'Theme Fonts Settings' /path/to/app/design/frontend/
And if it's in either an XML or PHTML file, this command would find it.
Alternatively, you can use an IDE/code editor tool to search for the string. Seeing that you are working over FTP, you're probably a Windows user and FTP is your deployment process, if not also your means for editing code live. If that's the case, you might not even have access to the commands I'm describing. In that case, you may have to resort to manual labor to verify files based on guesses.
Searching the database
In #3 above I gave you the 2 most common areas to check. It is also possible to search the database for placement of inline CSS in common areas. You can search the whole system configuration table on the database with a query; eg:
select * from core_config_data where value like '%Theme Fonts Settings%' G;
Often, 3rd-party themes will use system configuration to stuff in a bunch of settings. It may be in there.
If that turns up no answers, try the static blocks table; eg:
select * from cms_block where content like '%Theme Fonts Settings%' G;
Occasionally a theme might have specific blocks installed to serve content.
add a comment |
You can simply add this code in your css
and that should work:
.cms-index-index .page-title h1,
.cms-index-index .page-title h2,
.cms-index-index .page-print h1{font-size: 20px !important;}
Now, you need to find right css file and insert above code at the bottom.
How to find right css file?
Go to your home page and right click and then view source
. There you will see the list of the css fiels ahd <head>
section
You will see the url and that's the location in your ftp.
For example: if this is the url you find- http://domain.com/skin/frontend/themename/other/folder/css/cssname.css
then in you ftp: magento root/skin/frontend/themename/other/folder/css/cssname.css
This way you don't have to edit any template and layout files.
Hope this helps.
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help oflocal.xml
if he wants clean way.
– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "479"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f159469%2fhow-to-change-h1-font-size-on-homepage%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
James, your question is too generic and does not apply to Magento directly. You are probably using a 3rd-party theme which is hard to support in a forum like this. That said, I can tell you what Magento developers typically do to track down this kind of information.
How do I locate inline CSS in Magento?
If the CSS is truly inline somewhere, it's probably in any of 3 places:
- Layout XML [ reference ]
app/design/frontend/[package]/[theme]/layout
- Templates (PHTML)
app/design/frontend/[package]/[theme]/template
- System Configuration
- System > Configuration > General > Design > HTML Head > Miscellaneous HTML
- System > Configuration > General > Design > Footer > Miscellaneous HTML
Searching the code base
To find your code for #1 or 2, use a tool like grep
(Unix) or findstr
(Windows), searching over an entire folder. Here's an example for Unix systems:
grep -rn 'Theme Fonts Settings' /path/to/app/design/frontend/
And if it's in either an XML or PHTML file, this command would find it.
Alternatively, you can use an IDE/code editor tool to search for the string. Seeing that you are working over FTP, you're probably a Windows user and FTP is your deployment process, if not also your means for editing code live. If that's the case, you might not even have access to the commands I'm describing. In that case, you may have to resort to manual labor to verify files based on guesses.
Searching the database
In #3 above I gave you the 2 most common areas to check. It is also possible to search the database for placement of inline CSS in common areas. You can search the whole system configuration table on the database with a query; eg:
select * from core_config_data where value like '%Theme Fonts Settings%' G;
Often, 3rd-party themes will use system configuration to stuff in a bunch of settings. It may be in there.
If that turns up no answers, try the static blocks table; eg:
select * from cms_block where content like '%Theme Fonts Settings%' G;
Occasionally a theme might have specific blocks installed to serve content.
add a comment |
James, your question is too generic and does not apply to Magento directly. You are probably using a 3rd-party theme which is hard to support in a forum like this. That said, I can tell you what Magento developers typically do to track down this kind of information.
How do I locate inline CSS in Magento?
If the CSS is truly inline somewhere, it's probably in any of 3 places:
- Layout XML [ reference ]
app/design/frontend/[package]/[theme]/layout
- Templates (PHTML)
app/design/frontend/[package]/[theme]/template
- System Configuration
- System > Configuration > General > Design > HTML Head > Miscellaneous HTML
- System > Configuration > General > Design > Footer > Miscellaneous HTML
Searching the code base
To find your code for #1 or 2, use a tool like grep
(Unix) or findstr
(Windows), searching over an entire folder. Here's an example for Unix systems:
grep -rn 'Theme Fonts Settings' /path/to/app/design/frontend/
And if it's in either an XML or PHTML file, this command would find it.
Alternatively, you can use an IDE/code editor tool to search for the string. Seeing that you are working over FTP, you're probably a Windows user and FTP is your deployment process, if not also your means for editing code live. If that's the case, you might not even have access to the commands I'm describing. In that case, you may have to resort to manual labor to verify files based on guesses.
Searching the database
In #3 above I gave you the 2 most common areas to check. It is also possible to search the database for placement of inline CSS in common areas. You can search the whole system configuration table on the database with a query; eg:
select * from core_config_data where value like '%Theme Fonts Settings%' G;
Often, 3rd-party themes will use system configuration to stuff in a bunch of settings. It may be in there.
If that turns up no answers, try the static blocks table; eg:
select * from cms_block where content like '%Theme Fonts Settings%' G;
Occasionally a theme might have specific blocks installed to serve content.
add a comment |
James, your question is too generic and does not apply to Magento directly. You are probably using a 3rd-party theme which is hard to support in a forum like this. That said, I can tell you what Magento developers typically do to track down this kind of information.
How do I locate inline CSS in Magento?
If the CSS is truly inline somewhere, it's probably in any of 3 places:
- Layout XML [ reference ]
app/design/frontend/[package]/[theme]/layout
- Templates (PHTML)
app/design/frontend/[package]/[theme]/template
- System Configuration
- System > Configuration > General > Design > HTML Head > Miscellaneous HTML
- System > Configuration > General > Design > Footer > Miscellaneous HTML
Searching the code base
To find your code for #1 or 2, use a tool like grep
(Unix) or findstr
(Windows), searching over an entire folder. Here's an example for Unix systems:
grep -rn 'Theme Fonts Settings' /path/to/app/design/frontend/
And if it's in either an XML or PHTML file, this command would find it.
Alternatively, you can use an IDE/code editor tool to search for the string. Seeing that you are working over FTP, you're probably a Windows user and FTP is your deployment process, if not also your means for editing code live. If that's the case, you might not even have access to the commands I'm describing. In that case, you may have to resort to manual labor to verify files based on guesses.
Searching the database
In #3 above I gave you the 2 most common areas to check. It is also possible to search the database for placement of inline CSS in common areas. You can search the whole system configuration table on the database with a query; eg:
select * from core_config_data where value like '%Theme Fonts Settings%' G;
Often, 3rd-party themes will use system configuration to stuff in a bunch of settings. It may be in there.
If that turns up no answers, try the static blocks table; eg:
select * from cms_block where content like '%Theme Fonts Settings%' G;
Occasionally a theme might have specific blocks installed to serve content.
James, your question is too generic and does not apply to Magento directly. You are probably using a 3rd-party theme which is hard to support in a forum like this. That said, I can tell you what Magento developers typically do to track down this kind of information.
How do I locate inline CSS in Magento?
If the CSS is truly inline somewhere, it's probably in any of 3 places:
- Layout XML [ reference ]
app/design/frontend/[package]/[theme]/layout
- Templates (PHTML)
app/design/frontend/[package]/[theme]/template
- System Configuration
- System > Configuration > General > Design > HTML Head > Miscellaneous HTML
- System > Configuration > General > Design > Footer > Miscellaneous HTML
Searching the code base
To find your code for #1 or 2, use a tool like grep
(Unix) or findstr
(Windows), searching over an entire folder. Here's an example for Unix systems:
grep -rn 'Theme Fonts Settings' /path/to/app/design/frontend/
And if it's in either an XML or PHTML file, this command would find it.
Alternatively, you can use an IDE/code editor tool to search for the string. Seeing that you are working over FTP, you're probably a Windows user and FTP is your deployment process, if not also your means for editing code live. If that's the case, you might not even have access to the commands I'm describing. In that case, you may have to resort to manual labor to verify files based on guesses.
Searching the database
In #3 above I gave you the 2 most common areas to check. It is also possible to search the database for placement of inline CSS in common areas. You can search the whole system configuration table on the database with a query; eg:
select * from core_config_data where value like '%Theme Fonts Settings%' G;
Often, 3rd-party themes will use system configuration to stuff in a bunch of settings. It may be in there.
If that turns up no answers, try the static blocks table; eg:
select * from cms_block where content like '%Theme Fonts Settings%' G;
Occasionally a theme might have specific blocks installed to serve content.
edited May 23 '17 at 12:37
Community♦
1
1
answered Feb 13 '17 at 2:08
Rick BuczynskiRick Buczynski
2,331720
2,331720
add a comment |
add a comment |
You can simply add this code in your css
and that should work:
.cms-index-index .page-title h1,
.cms-index-index .page-title h2,
.cms-index-index .page-print h1{font-size: 20px !important;}
Now, you need to find right css file and insert above code at the bottom.
How to find right css file?
Go to your home page and right click and then view source
. There you will see the list of the css fiels ahd <head>
section
You will see the url and that's the location in your ftp.
For example: if this is the url you find- http://domain.com/skin/frontend/themename/other/folder/css/cssname.css
then in you ftp: magento root/skin/frontend/themename/other/folder/css/cssname.css
This way you don't have to edit any template and layout files.
Hope this helps.
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help oflocal.xml
if he wants clean way.
– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
add a comment |
You can simply add this code in your css
and that should work:
.cms-index-index .page-title h1,
.cms-index-index .page-title h2,
.cms-index-index .page-print h1{font-size: 20px !important;}
Now, you need to find right css file and insert above code at the bottom.
How to find right css file?
Go to your home page and right click and then view source
. There you will see the list of the css fiels ahd <head>
section
You will see the url and that's the location in your ftp.
For example: if this is the url you find- http://domain.com/skin/frontend/themename/other/folder/css/cssname.css
then in you ftp: magento root/skin/frontend/themename/other/folder/css/cssname.css
This way you don't have to edit any template and layout files.
Hope this helps.
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help oflocal.xml
if he wants clean way.
– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
add a comment |
You can simply add this code in your css
and that should work:
.cms-index-index .page-title h1,
.cms-index-index .page-title h2,
.cms-index-index .page-print h1{font-size: 20px !important;}
Now, you need to find right css file and insert above code at the bottom.
How to find right css file?
Go to your home page and right click and then view source
. There you will see the list of the css fiels ahd <head>
section
You will see the url and that's the location in your ftp.
For example: if this is the url you find- http://domain.com/skin/frontend/themename/other/folder/css/cssname.css
then in you ftp: magento root/skin/frontend/themename/other/folder/css/cssname.css
This way you don't have to edit any template and layout files.
Hope this helps.
You can simply add this code in your css
and that should work:
.cms-index-index .page-title h1,
.cms-index-index .page-title h2,
.cms-index-index .page-print h1{font-size: 20px !important;}
Now, you need to find right css file and insert above code at the bottom.
How to find right css file?
Go to your home page and right click and then view source
. There you will see the list of the css fiels ahd <head>
section
You will see the url and that's the location in your ftp.
For example: if this is the url you find- http://domain.com/skin/frontend/themename/other/folder/css/cssname.css
then in you ftp: magento root/skin/frontend/themename/other/folder/css/cssname.css
This way you don't have to edit any template and layout files.
Hope this helps.
answered Feb 13 '17 at 3:44
Adarsh KhatriAdarsh Khatri
6,67111643
6,67111643
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help oflocal.xml
if he wants clean way.
– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
add a comment |
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help oflocal.xml
if he wants clean way.
– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
Notice that the OP said the CSS is not in a file, but inline on his pages somewhere.
– Rick Buczynski
Feb 13 '17 at 3:48
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help of
local.xml
if he wants clean way.– Adarsh Khatri
Feb 13 '17 at 3:49
I understand, and my solution will work just fine. The idea is to add the code in active css (any file). He can even add a separate file with the help of
local.xml
if he wants clean way.– Adarsh Khatri
Feb 13 '17 at 3:49
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
Agreed, but even on that point I would be careful to advocate CSS overrides. I would not like to inherit a store that follows such a practice.
– Rick Buczynski
Feb 13 '17 at 3:51
add a comment |
Thanks for contributing an answer to Magento Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f159469%2fhow-to-change-h1-font-size-on-homepage%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown