tleeman wrote:I would like to add some pdf files to a custom tab on a Product page. The Nop Attachments plugin adds them to different parts of the Product page depending upon the selected Widget Zone. Would adding a custom tab as a new Widget Zone be the best way to do this? If yes, what files would need modification? I'm using nopCommerce 3.2, thanks.
Hello,
I will show you the easiest way to do this:
First you need your QuickTabs to work without Ajax. Go to the admin site - Nop Quick Tabs > Ajax Settings > Enable ajax - uncheck it.
Next you must add a new widget zone to
\Plugins\SevenSpikes.Nop.Plugins.Attachments\SupportedWidgetZones.xml file of the Attachments.
Just add this line(you can change the name as you want):
<WidgetZone>quick_tabs_attachment_tab</WidgetZone>
Next you go to:
\Plugins\SevenSpikes.Nop.Plugins.NopQuickTabs\Views\ProductTab\_ProductTabsWithoutAjax.cshtml and replace your code with this one:
@** Copyright 2014 Seven Spikes Ltd. All rights reserved. (http://www.nop-templates.com)
* http://www.nop-templates.com/t/licensinginfo
*@
@using Nop.Core.Infrastructure
@using Nop.Core
@using SevenSpikes.Nop.Plugins.NopQuickTabs
@model SevenSpikes.Nop.Plugins.NopQuickTabs.Models.TabUIModel
<script type="text/javascript">
jQuery(function ($) {
$("#quickTabs").tabs();
});
</script>
@{
var attachmentsTabContent = Html.Widget("quick_tabs_attachment_tab");
bool hasAttachments = true;
if (attachmentsTabContent == null || attachmentsTabContent == MvcHtmlString.Empty || string.Compare(attachmentsTabContent.ToString().Trim(), string.Empty, StringComparison.InvariantCultureIgnoreCase) == 0)
{
hasAttachments = false;
}
}
<div id="quickTabs" class="productTabs">
<div class="productTabs-header">
<ul>
@foreach (var tabInfo in Model.Tabs)
{
<li>
<a href="#[email protected]">@tabInfo.Title</a>
</li>
}
@if (hasAttachments)
{
<li>
<a href="#quickTab-attachments-in-tab">Attachments</a>
</li>
}
@* Uncomment the code below if you want to have a Tab that gets its information from a Topic. This tab will be shown for all products in your store*@
@*<li><a href="#quickTab-ShippingInfo">@T("ShippingReturns")</a> </li>*@
</ul>
</div>
<div class="productTabs-body">
@foreach (var tabInfo in Model.Tabs)
{
<div id="[email protected]">
@Html.Raw(tabInfo.Content)
</div>
}
@if (hasAttachments)
{
<div id="quickTab-attachments-in-tab">
@attachmentsTabContent
</div>
}
@* Uncomment the code below if you want to have a Tab that gets its information from a Topic. This tab will be shown for all products in your store *@
@*<div id="quickTab-ShippingInfo">
@Html.Action("TopicBlock", "ProductTab", new { systemName = "ShippingInfo" })
</div>*@
</div>
</div>
The parts in bold are the new one.
Note that "
quick_tabs_attachment_tab" exists on two lines and must be consistent on both of them.
Finally, you rebuild your solution and everything should work ! That is how you can have attachments in tab !
