- Moderator
- 1044
Help make Nop-Templates products better. Share your ideas or feature requests related to the Nop HTML Widgets plugin for nopCommerce.
Feature Requests
- 6
I would like to see another option for COndition Type for Topics. I'd like to put a widget zone on the generic topics view, but be able to show different content in that widget zone on each page.
For example, on topic page A, show one image in the widget zone, but on topic page B show a different image in the same widget zone.
For example, on topic page A, show one image in the widget zone, but on topic page B show a different image in the same widget zone.
- Moderator
- 386
I would like to see another option for COndition Type for Topics. I'd like to put a widget zone on the generic topics view, but be able to show different content in that widget zone on each page.
For example, on topic page A, show one image in the widget zone, but on topic page B show a different image in the same widget zone.
For example, on topic page A, show one image in the widget zone, but on topic page B show a different image in the same widget zone.
Hi Ron,
thank you for your feedback !
Please suggest this idea to our uservoice portal and we might consider adding it in the future releases of the plugin.
Regards,
Hristian Dimov
Nop-Templates.com
Hristian Dimov
Nop-Templates.com
- 34
Greetings Gentlemen,
Just purchased the HTML Widgets Plugin, Works really great on desktop, but is there any way we can eliminate the widgets from showing on the mobile version?! Perhaps a CSS code to add?!
Thank you
Just purchased the HTML Widgets Plugin, Works really great on desktop, but is there any way we can eliminate the widgets from showing on the mobile version?! Perhaps a CSS code to add?!
Thank you
- Moderator
- 157
Greetings Gentlemen,
Just purchased the HTML Widgets Plugin, Works really great on desktop, but is there any way we can eliminate the widgets from showing on the mobile version?! Perhaps a CSS code to add?!
Thank you
Just purchased the HTML Widgets Plugin, Works really great on desktop, but is there any way we can eliminate the widgets from showing on the mobile version?! Perhaps a CSS code to add?!
Thank you
Hi ezzat2k,
Thank you for the kind words.
You can do the following:
Open the Plugins\SevenSpikes.Nop.Plugins.HtmlWidgets\Views\HtmlWidget\_HtmlWidget.cshtml view and add a class to the div, i.e.
<div class="html-widget">
@Html.Raw(htmlwidget.HtmlContent)
</div>
Then you can add a css media query to hide the widget under a specific view port, i.e.
@media all and (max-width: 768px) {
.html-widget {display: none;}
}Thus all html widgets will be hidden under 768px viewport which is the view port of a tablet in portrait mode.
Hope that helps!
Best Regards,
Stefan Hristov
Nop-Templates.com
Stefan Hristov
Nop-Templates.com
- 34
Thank you for the quick response, this did hide the widgets on mobile, but I noticed on mobile devices if you flip your phone horizontal (even though the widget is not showing) its not allowing the theme to stretch (Right column Categories i.e.) it only does when I remove the widget completely (Make it not visible in Html Widget Settings)
https://www.dropbox.com/s/oz482px1fjxrq7m/IMG_20141113_105113.png?dl=0
Thank you
https://www.dropbox.com/s/oz482px1fjxrq7m/IMG_20141113_105113.png?dl=0
Thank you
- Moderator
- 157
Hi ezzat2k,
You see the html widget because when you turn the tablet in landscape mode, the viewport gets bigger than 768px and according to the media query it will be displayed.
So you have two options in general:
1. Remove the html widgets on mobile devices regardless the width of the display. Just open the _Root.Head.cshtml from your theme or from the general Views folder of nopCommerce and add the following:
in the <head>
and then in the <body> the following js
2. If you want to hide the html widgets depending on the width of the viewport just change the 768 from the media query from my previous post.
Hope that helps!
You see the html widget because when you turn the tablet in landscape mode, the viewport gets bigger than 768px and according to the media query it will be displayed.
So you have two options in general:
1. Remove the html widgets on mobile devices regardless the width of the display. Just open the _Root.Head.cshtml from your theme or from the general Views folder of nopCommerce and add the following:
in the <head>
Html.AddScriptParts("~/Plugins/SevenSpikes.Core/Scripts/SevenSpikesExtensions.js");and then in the <body> the following js
<script type="text/javascript">
$(document).ready(function () {
if ($.isMobile())
{
$('.html-widget').hide();
}
})
</script>
2. If you want to hide the html widgets depending on the width of the viewport just change the 768 from the media query from my previous post.
Hope that helps!
Best Regards,
Stefan Hristov
Nop-Templates.com
Stefan Hristov
Nop-Templates.com
- 34
Thank you for your time and effort, however this this didn't work, I mean it does work to hid the widget but that wasn't my issue, using the CSS to hide the widget worked, except in both methods, CSS and JS while the widget was hidden it effected the mobile layout (horizontally only).
If I hide the widget, using CSS or JS everything looks fine (vertically), But Horizontally the (Categories) and (popular tags) don't stretch please see attached pic.
However If I Uncheck (Visible) from the (Html Widget Settings) everything show right on the (horizontal mobile layout) Very strange
https://www.dropbox.com/s/oz482px1fjxrq7m/IMG_20141113_105113.png?dl=0
- Moderator
- 157
Hi ezzat2k,
Can you try the following approach using the js method. Just change the js function as shown below:
Please let us how it goes!
Thanks!
Can you try the following approach using the js method. Just change the js function as shown below:
<script type="text/javascript">
$(document).ready(function () {
if ($.isMobile())
{
$('.html-widget').remove();
}
})
</script>
Please let us how it goes!
Thanks!
Best Regards,
Stefan Hristov
Nop-Templates.com
Stefan Hristov
Nop-Templates.com
