Register Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools
  #1  
Old 23 Oct 2013, 23:06
RedTurtle's Avatar
RedTurtle RedTurtle is offline
 
Join Date: May 2006
Change ad_thread_first_post_content CSS?

I am trying to get some code to show up when a user is using adblocker on my site.

The problem is that the vBulletin CSS for the template ad_thread_first_post_content keeps getting blocked by the adblock extension itself.

I am trying to rename the <div id="ad_thread_first_post_content"> to remove the word 'ad' (so that it does not get blocked by adblock) but when I rename that div ID and then make the changes to the css in vbulletin-chrome.css and in showthread.css (renaming all instances of #ad_thread_first_post_content in both files) and what ends up happening is that the entire template no longer loads on the showthread page.

Is there any correct way to rename this div and all the css references to it?

Thank you!
Reply With Quote
  #2  
Old 23 Oct 2013, 23:22
tbworld tbworld is offline
 
Join Date: Oct 2008
1. The ad blocking software manipulates the DOM via java script. It looks for key identifiers in your page and manipulates the code accordingly.

2. Since that is an #ID you are dealing with, vbulletin might also be doing something dynamically with it.

Just hoping to give you something to look at. Unfortunately, I have never messed with the 'Ad' code in vbulletin. I would have to see exactly what you are trying to do, to be of any more assistance.
Reply With Quote
  #3  
Old 23 Oct 2013, 23:42
RedTurtle's Avatar
RedTurtle RedTurtle is offline
 
Join Date: May 2006
Thanks tbworld.

So you're right, adblock does find the div ID ad_thread_first_post_content and hides it dynamically.

However, if I was able to rename that ID to another one that did not include the word "ad" in it, then this would not be blocked (I have tested this theory with changing the ID in firebug).

So what I am trying to do now is make it so that I can change that ID permanently (versus just temporarily editing it with firebug). I am not sure what I need to do to make this happen.

Once I have the div renamed, I will then be able to have an alternate image show up in place of the ad that adblocker blocks.

Hope that makes sense...

Thank you.
Reply With Quote
  #4  
Old 24 Oct 2013, 00:05
tbworld tbworld is offline
 
Join Date: Oct 2008
I will take a look at the ad-block code when I have a chance. Although they might target the word 'Ad' the determination to hide the block would not just rest on that trigger and would primarily be triggered by the 'content': the code would then manipulate the DOM by either finding a block element to hide or adding a block element as needed. Your test in firebug might not be accurate as the page has already been rendered via the browser.

I would be creating my own test page, place an ad on it and step through the 'ad-block' JavaScript.

I am pretty busy right now, but if you run into trouble let me know and I will try to make some time to get you back on track.

Last edited by tbworld; 24 Oct 2013 at 02:20.
Reply With Quote
  #5  
Old 24 Oct 2013, 00:19
RedTurtle's Avatar
RedTurtle RedTurtle is offline
 
Join Date: May 2006
Originally Posted by tbworld View Post
Although they might target the word 'Ad' the determination to hide the block would not just rest on that trigger and would primarily be triggered by the 'content: then manipulate the DOM by either finding a block element to hide or adding a block element as needed.
Thanks for the response again. I'm sorry but I don't know what this means.

To show you what I am trying to do though here is my ad code that goes in the Manage Ads section of vB and is showing in the first post of a thread:


Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

What I am doing is that when the adblocker blocks the google ad, I then have some jQuery check to see if the ad class is visible or not. If the ad class is not visible (meaning adblocker has blocked the ad), I then append a css class to the div id "test". Making "test" into #test .adblocked instead.

The CSS class for .adblocked is set to display an alternate image asking the user to help support the site and disable adblock.

So <div id="test"></div> becomes <div id="test" class="adblocked"></div> when an adblocker is running.

Now this part works great, except for the fact that all this is happening inside the div id ad_thread_first_post_content. Because of the name of that div, everything inside it is being hidden by the adblocker and therefore my test div does not show up properly when an adblocker is being detected.

If I can change the name of <div id="ad_thread_first_post_content"> somehow, then I would be able to have my code work.

Thanks for your time.
Reply With Quote
  #6  
Old 24 Oct 2013, 02:29
tbworld tbworld is offline
 
Join Date: Oct 2008
PM me your jquery code or if you have a link to your site with the code already on a page, that will do to. I will take a look at it later this evening.
Reply With Quote
  #7  
Old 24 Oct 2013, 02:58
RedTurtle's Avatar
RedTurtle RedTurtle is offline
 
Join Date: May 2006
Thanks tbworld. I will PM it to you. Really appreciate the help.
Reply With Quote
  #8  
Old 13 Jul 2017, 17:27
Guest200915
Guest
 
Have you got solution of this problem?
Reply With Quote
  #9  
Old 02 Aug 2017, 00:52
webmastersun's Avatar
webmastersun webmastersun is offline
 
Join Date: Oct 2013
Originally Posted by RedTurtle View Post
Is there any correct way to rename this div and all the css references to it?
There are 2 ways:
- Search and replace.
- create a new div and copying styles from ad_thread_first_post_content to paste into another css file that you can control.
__________________
The best webmaster forum & internet marketing forum for webmasters and internet marketers.
Reply With Quote
  #10  
Old 04 Aug 2017, 19:45
noypiscripter's Avatar
noypiscripter noypiscripter is offline
 
Join Date: Aug 2013
Why not just dynamically create the test div outside the ad_thread_first_post_content div using Javascript/jQuery? Since it is outside the ad div, then it will not be hidden. No need to rename the id.
__________________
Glenn Vergara, an ex-vB Developer, now a vB Mod Developer

GIPHY for vB5 | AutoLinker | Video Attachments Player | New Registered Users Module | Clear System Cache Cron | DragNDrop Upload | Topic AJAX AutoUpdate | Force Read Topic
Reply With Quote
  #11  
Old 05 Aug 2017, 02:28
GHRake GHRake is offline
 
Join Date: Sep 2015
Real name: Anomander Rake
An example that is working for me, I just copy and paste the original css below and rename them

In vbulletin-chrome.css:

Block Disabled:      (Update License Status)  
Suspended or Unlicensed Members Cannot View Code.

And then in ad_global_above_footer I change the div id to match:
<div id="avt_global_above_footer">

aggresive adblock filters will filter by common ad image size so you can change the image sizes by 1 pixel length and width to bypass
Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off


New To Site? Need Help?

All times are GMT. The time now is 14:45.

Layout Options | Width: Wide Color: