Wrapping Wordpress Header & Footer

Need some custom code changes to the phpBB core simple enough that you feel doesn't require an extension? Then post your request here so that community members can provide some assistance.

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Thu Jul 27, 2017 7:55 am

ap125 wrote:
Fri Jul 21, 2017 6:18 pm
1) Is there a reason why the logo doesn't show up on mobile for the forum?
and
That's default behaviour of the parent theme (Prosilver). It's made like this to save space on smaller devices. You can change this if desired in your own theme.
2) What line needs to be added to a child style in order to make the style appropriate for the theme? I put a footer in the overall_footer.html of the child style and added <!-- INCLUDECSS syle.css -->, like the guide said, but it just showed a white screen.
Not sure, but it seems to me you have made a typo. Shouldn't it be style.css? If the file cannot be found, it might be the reason for the white screen.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Thu Jul 27, 2017 3:46 pm

Thanks again for your reply, Ger. I appreciate it.
Ger wrote:
Thu Jul 27, 2017 7:55 am
ap125 wrote:
Fri Jul 21, 2017 6:18 pm
1) Is there a reason why the logo doesn't show up on mobile for the forum?
and
That's default behaviour of the parent theme (Prosilver). It's made like this to save space on smaller devices. You can change this if desired in your own theme.
But the "COLORMAG" logo is already coded in the overall_header.html of the child style to show up I believe, so I don't know why it isn't showing up on mobile?
Ger wrote:
Thu Jul 27, 2017 7:55 am
ap125 wrote:
Fri Jul 21, 2017 6:18 pm
2) What line needs to be added to a child style in order to make the style appropriate for the theme? I put a footer in the overall_footer.html of the child style and added <!-- INCLUDECSS syle.css -->, like the guide said, but it just showed a white screen.
Not sure, but it seems to me you have made a typo. Shouldn't it be style.css? If the file cannot be found, it might be the reason for the white screen.
I tried changing the code to <!-- INCLUDECSS style.css --> and it still was just simply white. I'm not sure if I am supposed to add it to a specific location in the overall_footer.html file?

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Fri Jul 28, 2017 7:57 am

ap125 wrote:
Thu Jul 27, 2017 3:46 pm
But the "COLORMAG" logo is already coded in the overall_header.html of the child style to show up I believe, so I don't know why it isn't showing up on mobile?
It is, but any logo is automatically hidden for small devices (mobile). That's called responsive desgin.

You can override this in your own style definition, by adding these lines to the bottom of ./styles/colormag/theme/stylesheet.css

Code: Select all

@media (max-width: 700px) {
    .logo {
	display: inline-block;
	margin-top: -30px;
    }
    .social-links {
	margin-top: -70px;
    }
    .main-navigation {
	margin-top: -16px;
    }
}
This also compensates for the bigger space the logo claims.
ap125 wrote:
Thu Jul 27, 2017 3:46 pm
I tried changing the code to <!-- INCLUDECSS style.css --> and it still was just simply white. I'm not sure if I am supposed to add it to a specific location in the overall_footer.html file?
Do you have the correct path for the .css file? It should be relative to style's template directory, e.g. if the file is in ./styles/colormag/theme/style.css you should include it with
<!-- INCLUDECSS ./theme/style.css -->

If you want to include a file outside of the current style, you should simply use the regular HTML <link> tag.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Sat Jul 29, 2017 3:05 am

Perfect! The mobile version now has the logo displayed with that minute change. Thank you!

As for the format of the footer, I specified the location and name of the location of the .css file, and added <!-- INCLUDECSS /public_html/forum/styles/colormag/theme/stylesheet.css --> to the overall_footer.html, which is from the root directory to the .css file. The page no longer becomes white, but it still did not fix the format :?:

I also tried playing around with that line, taking away the /public_html part, then the /forum part, but none seemed to work... Really odd?

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Sat Jul 29, 2017 6:58 am

You have the wrong path. Read my previous post again.

Also: that stylesheet is already included, so why do you want to include it again?
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Sat Jul 29, 2017 9:19 pm

I tried the exact path in your post, but it still did not seem to work.

The stylesheet.css is already present in the colormag child style (located in styles/colormag/theme/stylesheet.css) . I want to include the <!-- INCLUDECSS ./theme/style.css --> line of code in the overall_footer.html file in order to actually have the format of the footer, in the forum, look like the footer in the rest of the website.

Thanks again.

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Mon Jul 31, 2017 6:43 am

But when I look at http://www.kenkiarash.com/forum/styles/ ... /style.css
That file is not there.

Anyway, if you want to include an extra CSS file on every page as a basic part of your style, I'd just add a line to overall_header.html.
Look for (around line 62):

Code: Select all

<link href="{T_STYLESHEET_LINK}" rel="stylesheet">

and add ad a new line below:

Code: Select all

<link href="{ROOT_PATH}styles/colormag/theme/style.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet" />
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Tue Aug 01, 2017 1:47 am

I think there may be a confusion. There actually is no style.css file in the child theme. I think the file providing the colormag style on the phpBB forum, like for the header, is in the stylesheet.css, located in the theme folder.

What my goal is, is that just like the header of the forum looks like the rest of the wordpress website, being the colormag theme, I want the footer of the forum to look like the rest of the website too, not like phpBB. I added the new line in the overall_header.html file where you indicated, but it did not have an effect on the footer of the forum.

Sorry for the confusion, thank you in advance.

User avatar
Chico Gois
Translator
Posts: 33
Joined: Tue Mar 28, 2006 4:42 am
Location: São Paulo - Brasil
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Chico Gois » Tue Aug 01, 2017 3:14 am

Hi,

Is this what you want?

Demo: http://phpbb3.xyz/phpBB3/index.php
Last edited by Chico Gois on Tue Aug 01, 2017 3:14 pm, edited 1 time in total.
Mundo phpBB
phpBB3, Joomla e algo mais...

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Tue Aug 01, 2017 6:50 am

ap125 wrote:
Tue Aug 01, 2017 1:47 am
What my goal is, is that just like the header of the forum looks like the rest of the wordpress website, being the colormag theme, I want the footer of the forum to look like the rest of the website too, not like phpBB. I added the new line in the overall_header.html file where you indicated, but it did not have an effect on the footer of the forum.
If that's your goal, you don't need to include another stylesheet. Just add the required definitions to the main ./styles/colormag/theme/stylesheet.css file.
This also requires HTML changes, so copy the file
./styles/prosilver/template/overall_footer.html
to
./styles/colormag/template/overall_footer.html
Apply your changes to the copied file.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Wed Aug 02, 2017 4:19 am

Ger wrote:
Tue Aug 01, 2017 6:50 am
If that's your goal, you don't need to include another stylesheet. Just add the required definitions to the main ./styles/colormag/theme/stylesheet.css file.
Is there a specific place I can find the required definitions? Sorry for my naive level of knowledge.
Ger wrote:
Tue Aug 01, 2017 6:50 am
This also requires HTML changes, so copy the file
./styles/prosilver/template/overall_footer.html
to
./styles/colormag/template/overall_footer.html
Apply your changes to the copied file.
I have actually completed this, but just made a new overall_footer.html file in the child theme ./styles/colormag/template/overall_footer.html location. Right now, at http://www.kenkiarash.com/forum/ you can see the footer that I want, just without the correct style. I just need to figure out the required definitions for the stylesheet.css like you said above.

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Wed Aug 02, 2017 7:01 am

Look into your Wordpress stylesheet: http://www.kenkiarash.com/wp-content/th ... ss?ver=4.8

Look for:

Code: Select all

/* =FOOTER WIDGET AREA
----------------------------------------------- */
Copy that section to your forums' stylesheet.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Thu Aug 03, 2017 3:25 am

Yes, it seems like that did the trick, besides some font differences and formatting details.

Also, what seems weird, is that when you make the browsing window smaller, and the menu collapses to three lines on the left, they no longer seem to work and function as the menu. Any idea about that final minute detail?

Thanks again, Ger!

User avatar
Ger
Recognised Extension Developer
Posts: 1792
Joined: Wed Jan 02, 2008 7:35 pm
Location: 192.168.1.100
Contact:

Re: Wrapping Wordpress Header & Footer

Post by Ger » Thu Aug 03, 2017 6:39 am

Seems like you still have this in your overall_footer.html.

Code: Select all

<!DOCTYPE html>
<html dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}">

<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
Remove it.
My extensions:
Simple CMS, Feed post bot, Avatar Resize, Modbreak, Magic OGP, Live topic update, Modern Quote, Quoted Where (GDPR) and Autoresponder.
Newest: FAQ manager for 3.2

Like my work? Buy me a coffee to keep it coming. :ugeek:
-Available for custom work-

ap125
Registered User
Posts: 24
Joined: Sun Jun 25, 2017 9:15 pm

Re: Wrapping Wordpress Header & Footer

Post by ap125 » Fri Aug 04, 2017 3:57 am

Ger wrote:
Thu Aug 03, 2017 6:39 am
Seems like you still have this in your overall_footer.html.

Code: Select all

<!DOCTYPE html>
<html dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}">

<link href="{T_STYLESHEET_LINK}" rel="stylesheet">
Remove it.
Its done, removed. Still same weird format in the footer :?:

Post Reply

Return to “phpBB Custom Coding”

Who is online

Users browsing this forum: No registered users and 5 guests