Can you make a banner responsive to mobile screens using HTML only?

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
Post Reply
WWu777
Registered User
Posts: 514
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Can you make a banner responsive to mobile screens using HTML only?

Post by WWu777 » Wed Nov 22, 2017 7:41 pm

Dear support,
Is there an HTML code that will make a banner responsive to mobile screens and desktop screens? One that doesn't involve editing CSS? Can you set a percentage instead of the pixels of the height and width?

For example, how would I make these banner codes in HTML responsive to different sized screens? Is there a simple way?

Code: Select all

<iframe src="http://www.loveme.com/contentads/afa/events.shtml" width=250 Height=450>
</iframe>

<br><br>

<iframe src="http://loveme.com/igo/happierabroad/11/40/7/120/180/0" width="120" height="1260" scrolling="no" marginheight="0" marginwidth="0" frameborder="0"></iframe>

<br><br>

<!-- Banner link to Cherry Blossoms -->
<script language="JavaScript">
document.write('<A HREF="http://www.blossoms.com/?adid=WP3044" TARGET="_new" rel="nofollow"><img src="http://www.blossoms.com/banner.php?size=120x240" BORDER=0></A>');
</script>
<!-- End of banner link -->

User avatar
eeji
Jr. Style Validator
Posts: 582
Joined: Fri Dec 12, 2008 9:08 pm
Location: Manchester, UK

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by eeji » Wed Nov 22, 2017 9:07 pm

not with html alone.

WWu777
Registered User
Posts: 514
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by WWu777 » Thu Nov 23, 2017 12:55 am

What if I removed these parts of the code:

width=250 Height=450

Would the banners automatically be responsive like the rest of the forum, since its dimensions would no longer be set?

User avatar
Hanakin
Infrastructure Team Member
Infrastructure Team Member
Posts: 569
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by Hanakin » Thu Nov 23, 2017 12:53 pm

no HTML is not code its just markup so you can not add dynamic functionality with HTML by itself you need javascript or CSS

User avatar
Christian 2.0
Former Team Member
Posts: 4357
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by Christian 2.0 » Thu Nov 23, 2017 1:34 pm

Hi,

Can I ask what the end goal you're trying to achieve is?

I can see the iFrames load vertical banners. Where would you like them displayed on desktop, and where would you like them displayed on mobile?

Additionally can you explain the CSS limitation? Although you don't have access to edit the CSS coming through the iFrame, it's very easy to override it by adding CSS to your style's stylesheet using the same CSS selectors.

Thanks :)

WWu777
Registered User
Posts: 514
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by WWu777 » Thu Nov 23, 2017 9:42 pm

Christian 2.0 wrote:
Thu Nov 23, 2017 1:34 pm
Hi,

Can I ask what the end goal you're trying to achieve is?

I can see the iFrames load vertical banners. Where would you like them displayed on desktop, and where would you like them displayed on mobile?

Additionally can you explain the CSS limitation? Although you don't have access to edit the CSS coming through the iFrame, it's very easy to override it by adding CSS to your style's stylesheet using the same CSS selectors.

Thanks :)
I would like to make the banners responsive, like the new Google adsense banners are. That way, they will fit proportionately on both desktop screens and mobile screens. Currently the way my banners are on desktop screen is fine. That I know how to adjust. But the mobile screen shows them looking huge and going off the screen. Way out of proportion.

Is there a theme just for mobile screens like the previous versions of phpbb had?

How do you use CSS? How would CSS target an HTML banner code outside of it?

Thanks.

User avatar
Christian 2.0
Former Team Member
Posts: 4357
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by Christian 2.0 » Thu Nov 23, 2017 10:45 pm

Are you able to share a link to your forum?

It'll probably be easier to see what's going on and to recommend a fix :)

WWu777
Registered User
Posts: 514
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by WWu777 » Thu Nov 23, 2017 10:51 pm

Christian 2.0 wrote:
Thu Nov 23, 2017 10:45 pm
Are you able to share a link to your forum?

It'll probably be easier to see what's going on and to recommend a fix :)
Sure here:
http://www.happierabroad.com/forum/index.php

User avatar
Christian 2.0
Former Team Member
Posts: 4357
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by Christian 2.0 » Fri Nov 24, 2017 6:03 pm

Your forum contains subject matter that I fundamentally oppose.

I won't be able to help you.

WWu777
Registered User
Posts: 514
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: Can you make a banner responsive to mobile screens using HTML only?

Post by WWu777 » Tue Nov 28, 2017 8:26 pm

Ok well I found another solution. I installed another theme in my forum without the banner ads and named it a mobile theme, which it is since its responsive. I put a link to it in the header called "Mobile Friendly Theme". Then I used the Proflat theme since the other ones had bugs in them that caused the "online" tag to repeat all over the post. Only the Proflat theme worked without trouble. Otherwise I would have chosen Elegance or one of the Artodia styles.

If anyone else has a similar problem and can't make your banners responsive, I recommend doing the same. Just put a link at the top that's easy to see, called "Mobile Theme" or "Mobile Friendly Theme" so those on a mobile device can go to it quickly and not have to deal with disproportionate banners.

Hope that helps.

Post Reply

Return to “[3.2.x] Styles Support & Discussion”

Who is online

Users browsing this forum: CDal and 10 guests

cron