Show or conceal advertisement based on user role

I have developed a custom Web Control that acts as a container for a mobile banner, but I want to hide it from users who are admins.

So far, I've attempted the following:

<mob:MobileBanner runat="server" ID="MobileBanner" Visible='<%# Not HttpContext.Current.User.IsInRole("Admin") %>' />

Unfortunately, this approach doesn't seem to be working as expected.

I also considered wrapping the HTML code in a conditional check to display the advertisement content only if the user is not an admin, along with the necessary CSS link.

Although there is a similar query regarding enabling and disabling buttons based on user roles (referenced here), it pertains to ASP.NET Server Side buttons rather than a basic Web Control designed for holding HTML elements.

If anyone requires the implemented code, simply add a new Web Control to your project and paste the following snippet:

<link href = "my_css_file_here.css" rel="stylesheet" type="text/css" />

<div Class="my_banner_container">
    <!--Insert your banner code here-->
</div>

An alternative solution involves creating a server-side container within the master document and applying the following logic:

my_container.Visible = Not HttpContext.Current.User.IsInRole("Admin")

Additionally, you may need to adjust the padding-top property from 130px to 50px depending on the user's role status, requiring dynamic changes when an admin logs in or out.

For non-admins, consider utilizing a specific CSS file:

<link href = "my_css_file_130_here.css" rel="stylesheet" type="text/css" runat="server" />

Meanwhile, admins can use a different CSS file:

<link href = "my_css_file_50_here.css" rel="stylesheet" type="text/css" runat="server" />

Incorporate two distinct CSS files affecting the padding-top attribute and alter the href based on the user's admin privileges or lack thereof.

body {
     padding-top: 130px;
}

or

body {
     padding-top: 50px;
}

If you have any suggestions on how to streamline this process or propose a more efficient method, please share your ideas!

Answer №1

Avoid displaying it if you don't need it. It will only be displayed if the user is not in the Admin role.

<%If Not HttpContext.Current.User.IsInRole("Admin")
Then
    <mob:MobileBanner runat="server" ID="MobileBanner" />
End If %>

Answer №2

To solve the issue, I decided to include the stylesheet link in my code and set it to runat="server" with the href attribute pointing to a 120px padding.

Here is what I did in the form_load function of the master document:

If HttpContext.Current.User.IsInRole("Admin") Then
    my_container.Visible = False
    my_stylesheet.Href = "~/path_to_file50.css"
Else
    my_container.Visible = True
    my_stylesheet.Href = "~/path_to_file120.css"
End If

In the CSS files, I specified:

padding-top: 50px;

or

padding-top: 120px;

and kept the rest of the CSS rules in a separate file. Everything now appears to be functioning correctly, and by setting:

my_container.Visible = False

I should avoid Google's concern about generating impressions while on my own website.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Oops! Looks like there was an error: weight is not defined when trying to calculate BMI with the HTMLButtonElement

I'm currently working on a project to create a BMI calculator following specific instructions. I've managed to follow all the guidelines except one regarding the letsCalculateBMI function. The instruction states: letsCalculateBMI should extrac ...

Animating back with a jQuery if statement

Is there a way to implement an if statement that triggers an animation when the right image reaches +400px, and then animates back to -400px upon hovering over the image? $('#left img').mouseenter(function() { $('#right img').animate ...

Data is nowhere to be found despite using the post method, but the URL still contains valuable information

Recently, I've delved into the world of PHP and have been experimenting with HTML forms. Initially, I used the method GET which worked perfectly fine. However, when I switched to using the method POST, I encountered an issue where I couldn't retr ...

CSS footer element refuses to disappear

This sample application features a header, footer, and a content div that includes a table displaying various statistics of basketball players. One issue I encountered was with the footer when there were many entries in the table. This caused the footer t ...

Discovering elements with Selenium through XPATH or CSS Selector

Having trouble locating the "import" element using Selenium Webdriver in C#. I've attempted the following codes but haven't had any luck: driver.FindElement(By.XPath("//*[@class='menu_bg']/ul/li[3]")).Click(); driver.FindElement(By.XPa ...

What are the steps to switch multiple CSS styles for creating a dark mode?

I'm currently using a combination of HTML, CSS, and JavaScript to construct my website. One feature I'd like to implement is a Darkmode switch button that toggles between Dark and Light mode when clicked. However, the issue I'm facing is tha ...

Guide to making a dropdown menu that pulls information from a text box and displays the location within the text

I'm currently working on a unique dropdown feature that functions like a regular text field, displaying the text position. To achieve this, I've constructed a hidden dropdown menu positioned beneath the text field. My goal is to develop a jQuery ...

Incorrect viewport widths in Vue Bootstrap fluid containers

I require a container that spans 100% of the available width until it reaches a specific breakpoint (max-width). Upon exploring the official documentation, I came across the responsive fluid container, which appeared to be a suitable choice. Responsive ...

When using JavaScript, links within the window.location are automatically altered

When using window.location (.assign, .replace, .href) to redirect to a product page on click, I encountered an issue where it automatically changes some of the href links. For example: instead of "previous href= 'commercial/fonts/fonts.min.css' ...

Altering the placement of a single element from floating to fixed positioning in CSS

Currently in the process of designing a basic website, I am looking to modify the behavior of the navigation bar on the left-hand side. I want it to remain fixed in its position so that users can scroll through the page without losing sight of it. My main ...

The dimensions of the box remain fixed and do not change when the screen is resized

Just starting out with HTML and CSS and trying to create a responsive website. Running into an issue where the black striped box on my page is not moving up when I resize the screen. It appears to be stuck in place, causing a gap between it and the slide s ...

A preselected default option determined by your geographical location in an HTML document

After searching extensively for a solution, I've found this to be quite challenging... In my website's HTML page, there is a dropdown menu containing all the countries. <option value="AF">Afghanistan</option> <option value="AX"&g ...

CSS - Absolute positioning appears to be slightly choppy in Microsoft Edge

I have successfully implemented a slip scrolling function to reveal/hide a fixed logo on scroll, but I am facing some issues with Microsoft Edge browser. While testing in various browsers, everything works smoothly except for Microsoft Edge. In this brows ...

Top tips for writing JavaScript that incorporates an AJAX call to determine whether the default action should be blocked

Utilizing JavaScript and jQuery, I am developing a handler for form submission that will either allow or prevent the form from being submitted based on certain conditions. Although this task is fairly straightforward, it becomes more complex due to the ne ...

Arrange the bootstrap columns in a grid layout both vertically and horizontally adjacent to one another

I need help with displaying my columns in this specific layout https://i.stack.imgur.com/2hzju.jpg Code <div class="row"> <div id="id-orders-stats" class="col-md-6 col-sm-6"> </div> <div class="col-md-6 col-sm-6 stats-box"&g ...

Uncovering the jsPlumb link between a pair of identifiers

Could someone help me understand how to disconnect two HTML elements that are connected? I have the IDs of both elements, but I'm not sure how to locate their connection in the jsPlumb instance. Any tips on finding the connection between two IDs? ...

"Patience is a virtue: Tips for waiting until a webpage is completely loaded using

I attempted to use a special class name that only shows up after the page has completely loaded, but for some reason it appears before the content is visible on screen. try: WebDriverWait(self.browser, 20).until(EC.element_to_be_clickable((By.CLASS_NA ...

Read a local file using the HTML5 FileReader

I am currently working on developing an offline application that can read text from a locally stored text file. I have been researching and found that using html5 and FileReader can make this possible. My goal is to set a hard-coded relative path for the ...

Selecting the perfect default font using font-display: fallback

When I use a particular font and find that its loading time is too high, I want to set a default font. So I experimented with the following code: font-display: fallback; It seems to be working fine (although I haven't checked compatibilities yet), ...

Content positioned beside an image with the help of Bootstrap 4 framework

How can I align text to the right of an image, like a table layout? I experimented with grid layout using <div class="span2"> and <div class="span10"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bo ...