[3.3][BETA] Custom Code

A place for Extension Authors to post and receive feedback on Extensions still in development. No Extensions within this forum should be used within a live environment!
Ideas Centre
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations

IMPORTANT: Extensions Development rules

IMPORTANT FOR NEEDED EVENTS!!!
If you need an event for your extension please read this for the steps to follow to request the event(s)
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

trebla wrote:Great extension for the ones mastering the code.
I understand with help of it I would be able to add the OpenX banner to my forum header, without a need to modify files for each individual style used. On phpbb2 and phpbb3.0.x I have done it by editing directly the overall_header.html and "forcefully" adding a table with two cells, one containing the site logo and the other containing the banner. Search box has been pushed a bit down and is situated below the table.

Code: Select all

<div id="wrap">
	<a id="top" name="top" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>

                       <table width="100%" border='0' cellspacing="15" cellpadding="0">
                <tr>
                        <td><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>
                        <!--<td width="100%" align="center"><h1>{SITENAME}</h1><span class="gen">{SITE_DESCRIPTION}</span></td> -->
                        <td width="100%" align="center"><a href='http://myopenxserver.com/openx/www/delivery/ck.php?n=acc51c76&cb=INSERT_RANDOM_NUMBER_HERE' target='_blank'><img src='http://myopenxserver.com/openx/www/delivery/avw.php?zoneid=3&cb=INSERT_RANDOM_NUMBER_HERE&n=acc51c76' border='0' alt='' /></a></td>
                </tr>
                </table>
Current 3.0.x version of the forum is at http://velo.clubbers.ee/foorum/index.php

I have tried to figure out the way getting same result with this extension but I clearly admit I lack the knowledge of modern HTML for it.

I clearly do not want to be abusive, but could anyone offer me proper lines of code and name of file to contain that code. This would open me the way to upgrade my forum to 3.1.x.
There's no template event in that place. Template events are locations were extensions can insert extra template code.
If you look in the template they look like this: <!-- EVENT name_of_the_template_event -->
So I think direct editing like you did before is the most easy here.
trebla
Registered User
Posts: 8
Joined: Sat Feb 15, 2003 9:10 pm
Contact:

Re: [RC] Custom Code

Post by trebla »

Martti, thanks for the response and explanation.
User avatar
Oyabun1
Former Team Member
Posts: 23162
Joined: Sun May 17, 2009 1:05 pm
Location: Australia
Name: Bill

Re: [RC] Custom Code

Post by Oyabun1 »

                      Support Request Template
3.0.x: Knowledge Base Styles Support MOD Requests
3.1.x: Knowledge BaseStyles SupportExtension Requests
User avatar
hayatbanaguzel
Registered User
Posts: 2
Joined: Mon Jan 05, 2015 11:42 pm
Contact:

Re: [RC] Custom Code

Post by hayatbanaguzel »

"PR" Turkish translation ready on GitHub.
punya_akmal
Registered User
Posts: 3
Joined: Fri Jan 09, 2015 4:05 am
Location: Jakarta
Name: Akmal Ritaudin
Contact:

Re: [RC] Custom Code

Post by punya_akmal »

Hi Martti,

I am using the phpbb 3.1.2
I am using the Modern-Silver styles

I want to edit the "overall_header_stylesheets_after.html"

Code: Select all

<!-- GBC in headerbar styling -->
<style>
.headerbar {
   background-image: url("public_html/community/images/header1.jpg");
}

/** remove the logo and increase the height of the headerbar **/
.imageset.site_logo {
    background-image: none;
    padding-left: 0;
    padding-top: 100px;
}
</style>
Image

I think I already follow your instruction on the first page. The size of the header is changed, but the picture is not changed.
I also changed the image url with
/public_html/community/images/header1.jpg
//public_html/community/images/header1.jpg

But I am failed to changed the header. I am also try to change different image and size.

Sorry to bothering you. Thank you for the answer.
“Your phone is a tool for communicating, you should not be communicating with the phone; you should be communicating with somebody on the other side of the phone.” – Andy Rubin
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

punya_akmal wrote:Hi Martti,

I am using the phpbb 3.1.2
I am using the Modern-Silver styles

I want to edit the "overall_header_stylesheets_after.html"

Code: Select all

<!-- GBC in headerbar styling -->
<style>
.headerbar {
   background-image: url("public_html/community/images/header1.jpg");
}

/** remove the logo and increase the height of the headerbar **/
.imageset.site_logo {
    background-image: none;
    padding-left: 0;
    padding-top: 100px;
}
</style>
Image

I think I already follow your instruction on the first page. The size of the header is changed, but the picture is not changed.
I also changed the image url with
/public_html/community/images/header1.jpg
//public_html/community/images/header1.jpg

But I am failed to changed the header. I am also try to change different image and size.

Sorry to bothering you. Thank you for the answer.
You should use: (literally)

Code: Select all

.headerbar {
   background-image: url("{ROOT_PATH}images/header1.jpg");
}
ROOT_PATH is a template variable which points to the web root path of your board.

If it's still not loading after changing this, check if your style uses the same class headerbar for the headerbar.
Last edited by martti on Fri Jan 23, 2015 9:37 am, edited 2 times in total.
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

martti wrote:
trebla wrote:Great extension for the ones mastering the code.
I understand with help of it I would be able to add the OpenX banner to my forum header, without a need to modify files for each individual style used. On phpbb2 and phpbb3.0.x I have done it by editing directly the overall_header.html and "forcefully" adding a table with two cells, one containing the site logo and the other containing the banner. Search box has been pushed a bit down and is situated below the table.

Code: Select all

<div id="wrap">
	<a id="top" name="top" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>

                       <table width="100%" border='0' cellspacing="15" cellpadding="0">
                <tr>
                        <td><a href="{U_INDEX}">{SITE_LOGO_IMG}</a></td>
                        <!--<td width="100%" align="center"><h1>{SITENAME}</h1><span class="gen">{SITE_DESCRIPTION}</span></td> -->
                        <td width="100%" align="center"><a href='http://myopenxserver.com/openx/www/delivery/ck.php?n=acc51c76&cb=INSERT_RANDOM_NUMBER_HERE' target='_blank'><img src='http://myopenxserver.com/openx/www/delivery/avw.php?zoneid=3&cb=INSERT_RANDOM_NUMBER_HERE&n=acc51c76' border='0' alt='' /></a></td>
                </tr>
                </table>
Current 3.0.x version of the forum is at http://velo.clubbers.ee/foorum/index.php

I have tried to figure out the way getting same result with this extension but I clearly admit I lack the knowledge of modern HTML for it.

I clearly do not want to be abusive, but could anyone offer me proper lines of code and name of file to contain that code. This would open me the way to upgrade my forum to 3.1.x.
There's no template event in that place. Template events are locations were extensions can insert extra template code.
If you look in the template they look like this: <!-- EVENT name_of_the_template_event -->
So I think direct editing like you did before is the most easy here.
You could consider using Javascript to move the banner inside the headerbar.

Edit :: overall_header_body_before.html

Code: Select all

<!-- banner -->
<div id="hidden-banner" style="display: none;"><a href="http://imgur.com/aYXQQbl"><img src="http://i.imgur.com/aYXQQbl.jpg" title="source: imgur.com" /></a>
</div>
(I've used a different banner link here. Yours didn't return anything.)

Edit :: overall_header_stylesheets_after.html

Code: Select all

<!-- headerbar styling -->
<style>
/** replace the logo  **/
.imageset.site_logo {
    background-image: url("{ROOT_PATH}images/bananas.gif");
}

/** remove the board name **/
div#logodesc table tr td h1
{
    display: none;
}

div#logodesc table tr td span.gen
{
    display: none;
}
</style>
Edit :: overall_footer_after.html (E)

Code: Select all

<!-- move banner in headerbar -->
<script>
    var insertItem = document.getElementById('hidden-banner').firstChild;
    var referenceSpan = document.getElementsByClassName('gen')[0];
    referenceSpan.parentNode.insertBefore(insertItem, referenceSpan);
</script>
Image
Last edited by martti on Fri Jan 23, 2015 9:37 am, edited 1 time in total.
User avatar
GoBieN
Registered User
Posts: 546
Joined: Fri Mar 05, 2004 5:22 pm
Location: Belgium
Contact:

Re: [RC] Custom Code

Post by GoBieN »

Works like a charm. Thanks for the adsense example!
keep it up posting excellent use cases.
User avatar
mrgoldy
Development Team Member
Development Team Member
Posts: 1393
Joined: Tue Oct 06, 2009 7:34 pm
Location: The Netherlands
Name: Gijs
Contact:

Re: [RC] Custom Code

Post by mrgoldy »

Just wanted to let you know; works like a charm indeed!

Using it for a lot of things:
  • Own custom code
  • Piwik
  • Google AdSense
  • Contact Message
  • And more..
All works perfectly and thanks for the ideas. If you have anymore, feel free to share ;) haha
phpBB Studio / Member of the Studio

Contributing: You can do it too! Including testing Pull Requests (PR).
phpBB Development and Testing made easy.
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

Use case: Random Header Image

First remove the logo with inline styling:
Edit :: overall_header_stylesheets_after.html

Code: Select all

<!-- headerbar styling -->
<style>
/** remove the logo and increase the height of the headerbar **/
.imageset.site_logo {
    background-image: none;
    padding-left: 0;
    padding-top: 80px;
}
</style>
Then load a random background image with Javascript.

Edit :: overall_footer_after.html

Code: Select all

<!-- random header image -->
<script>
    var images = new Array();
    images[0] = 'apples.jpg';
    images[1] = 'bananas.jpg';
    images[2] = 'kiwis.jpg';
    
    var r = Math.floor(Math.random() * 3);
    var imageUrl = '{ROOT_PATH}images/headerbar/' + images[r];
    document.getElementsByClassName('headerbar')[0].style.backgroundImage = 'url(' + imageUrl + ')';
</script>
3 images is not a big pool of randomness off course, you have to adapt the snippet to your likings.

You could more simplify if you name your image files numbers, like 0.jpg, 1.jpg, 2.jpg

Then it could be like this:
Edit :: overall_footer_after.html

Code: Select all

<!-- random header image -->
<script>
    var imageUrl = '{ROOT_PATH}images/headerbar/' + Math.floor(Math.random() * 10) + '.jpg';
    document.getElementsByClassName('headerbar')[0].style.backgroundImage = 'url(' + imageUrl + ')';
</script>
This would select one image out of ten from the /image/headerbar directory, where the images are named 0.jpg to 9.jpg.

It is assumed the headerbar has a class named 'headerbar' like in prosilver, otherwise you have to adapt the selector to your style.
User avatar
alhitary
Registered User
Posts: 868
Joined: Wed Jan 17, 2007 7:51 am
Location: ROY
Name: Basil Taha Alhitary
Contact:

Re: [RC] Custom Code

Post by alhitary »

I still have the problem with custom code.
I got the bellow text when i click on the Extension module/tub in ACP ( after i enable the custom code ) :

Image

Image

Code: Select all

Fatal error: Uncaught exception 'Twig_Error_Loader' with message 'Unable to find template ".html" (looked into: ./../ext/marttiphpbb/customcode/adm/style, ./../adm/style).' in /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php:202 Stack trace: #0 /hsphere/local/home/c343768/alhitary.net/community/phpbb/template/twig/loader.php(106): Twig_Loader_Filesystem->findTemplate('.html') #1 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php(138): phpbb\template\twig\loader->findTemplate('.html') #2 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Environment.php(265): Twig_Loader_Filesystem->getCacheKey('.html') #3 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Environment.php(312): Twig_Environment->getTemplateClass('.html', NULL) #4 /hsphere/local/home/c343768/alhitary.net/community/phpbb/template/twig/environment.php(151): Twig_Environment->loadTemplate('.html', NULL) #5 /hsphe in /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php on line 202
:cry:
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

alhitary wrote:I still have the problem with custom code.
I got the bellow text when i click on the Extension module/tub in ACP ( after i enable the custom code ) :

Image

Image

Code: Select all

Fatal error: Uncaught exception 'Twig_Error_Loader' with message 'Unable to find template ".html" (looked into: ./../ext/marttiphpbb/customcode/adm/style, ./../adm/style).' in /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php:202 Stack trace: #0 /hsphere/local/home/c343768/alhitary.net/community/phpbb/template/twig/loader.php(106): Twig_Loader_Filesystem->findTemplate('.html') #1 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php(138): phpbb\template\twig\loader->findTemplate('.html') #2 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Environment.php(265): Twig_Loader_Filesystem->getCacheKey('.html') #3 /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Environment.php(312): Twig_Environment->getTemplateClass('.html', NULL) #4 /hsphere/local/home/c343768/alhitary.net/community/phpbb/template/twig/environment.php(151): Twig_Environment->loadTemplate('.html', NULL) #5 /hsphe in /hsphere/local/home/c343768/alhitary.net/community/vendor/twig/twig/lib/Twig/Loader/Filesystem.php on line 202
:cry:
I would say that you didn't disable once the extension when upgrading in the development process.
Did try my suggestions?
viewtopic.php?f=456&t=2275361&start=150#p13899256
Otherwise, probably you have to delete a row manually from the phpbb_modules table in the database, where lang_name = ACP_CUSTOMCODE_CREATE_DELETE. (This mode doesn't exist anymore.)
User avatar
alhitary
Registered User
Posts: 868
Joined: Wed Jan 17, 2007 7:51 am
Location: ROY
Name: Basil Taha Alhitary
Contact:

Re: [RC] Custom Code

Post by alhitary »

martti wrote: I would say that you didn't disable once the extension when upgrading in the development process.
Did try my suggestions?
viewtopic.php?f=456&t=2275361&start=150#p13899256
Yes I did but with same reslut
martti wrote: Otherwise, probably you have to delete a row manually from the phpbb_modules table in the database, where lang_name = ACP_CUSTOMCODE_CREATE_DELETE. (This mode doesn't exist anymore.)
plz how to delete the row manually ?
User avatar
martti
Registered User
Posts: 867
Joined: Thu Jul 31, 2014 8:23 am
Location: Belgium

Re: [RC] Custom Code

Post by martti »

alhitary wrote:
martti wrote: Otherwise, probably you have to delete a row manually from the phpbb_modules table in the database, where lang_name = ACP_CUSTOMCODE_CREATE_DELETE. (This mode doesn't exist anymore.)
plz how to delete the row manually ?
That depends on your setup. Most people have a MySQL database and use Phpmyadmin (for a remote server as it seems you have.)
Backup your data first. I hope you're not trying extensions in development on your live forum?
User avatar
alhitary
Registered User
Posts: 868
Joined: Wed Jan 17, 2007 7:51 am
Location: ROY
Name: Basil Taha Alhitary
Contact:

Re: [RC] Custom Code

Post by alhitary »

martti wrote: That depends on your setup. Most people have a MySQL database and use Phpmyadmin (for a remote server as it seems you have.)
Backup your data first. I hope you're not trying extensions in development on your live forum?
Yes i have MySQL database and use Phpmyadmin.
But i don't know how to delete manually.

I had extensions in development for test/check and then disabled and deleted them.
Now i have only some released extensions.
With only one in development which is ( upload extensions )
Post Reply

Return to “Extensions in Development”