Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

modal info popup


Mikepo

Recommended Posts

Hi,

Does anyone have the following app running using CE Frozen?

https://apps.oscommerce.com/iWJbv&modal-info-popup-layer-for-bootstrap-o

I did have it working on an early bootstrap version, back in 2015, put with CE frozen it doesn't popup when you first enter the shop site.

The Admin side seems to work ok, creating new popups with dates etc.

Hope someone can help?

Mike

osC CE live - developing osC Phoenix adding modules with no core changes(awesome and easy!)

Link to comment
Share on other sites

You can have a simple overlay simply using alert.

<script language="javascript" type="text/javascript">
alert("Welcome to my site")
</script>
<font face="Tahoma"><a target="_blank"
 href="https://chilleddisplays.co.uk/index.php/"><span
 style="font-size: 8pt; text-decoration: none;"></span></a></font>

 

 

Link to comment
Share on other sites

It's very simple but works, change the message in language file to what ever you need it to be. Just copy files and install in admin. Pop up will show when customer comes on to index page. Mod as you like. Have only tested on CE BS3 but shoud work on 4 as well.

running on test site

https://justfastfood.com/

image.thumb.png.82a3ab5fc650032e54d001b9000b5adf.png

JcM index Popup V1.0.zip

 

Link to comment
Share on other sites

23 hours ago, Mikepo said:

I did have it working on an early bootstrap version, back in 2015, put with CE frozen it doesn't popup when you first enter the shop site.

I had a look at the add-on and it needed some fixes to get it to work on CE BS3, I assume you already made those as you say you have the admin side working.

I too got the admin working and the output works fine as far as getin geting the info from admin, can even display it in a modal which is trigered by click. The problem is with bootstrap "show" function for modal. I can get it to work fine on a simple page but it fails to trigger when used in CE.

I think this is an issue with the js script not beeing called at the right time or having duplicates calls on the site? Which ever it is it's this bit that is not working the rest is fine.

I'll try and look into the "show" function a bit more when i have time.

 

Link to comment
Share on other sites

46 minutes ago, JcMagpie said:

I had a look at the add-on and it needed some fixes to get it to work on CE BS3, I assume you already made those as you say you have the admin side working.

I too got the admin working and the output works fine as far as getin geting the info from admin, can even display it in a modal which is trigered by click. The problem is with bootstrap "show" function for modal. I can get it to work fine on a simple page but it fails to trigger when used in CE.

I think this is an issue with the js script not beeing called at the right time or having duplicates calls on the site? Which ever it is it's this bit that is not working the rest is fine.

I'll try and look into the "show" function a bit more when i have time.

had a quick play myself, and got it to work by moving the java script part to the bottom of template bottom.

would it be easier to make to convert it to a header tag module, unless you can get the java script code to go below the bootstrap java script?

 

also is their any point in checking that it is being loaded on a https connection

Phoenix support now at https://phoenixcart.org/forum/
App created for phoenix
TinyMCE editor for admin

 

Link to comment
Share on other sites

24 minutes ago, JcMagpie said:

Good so it was just a js order issue. :thumbsup:

 

also had to change to javascript to

<script type="text/javascript">
    $(window).on('load',function(){
        $('#popupModal').modal('show');
    });
</script>

for bs3

Phoenix support now at https://phoenixcart.org/forum/
App created for phoenix
TinyMCE editor for admin

 

Link to comment
Share on other sites

48 minutes ago, puddlec said:

also had to change to javascript to 

Thank you, that was the missing bit, I'm not a javescript expert, so that fixed it. 😊

osC CE live - developing osC Phoenix adding modules with no core changes(awesome and easy!)

Link to comment
Share on other sites

59 minutes ago, valquiria23 said:

It would be great if you can fix it and upload a new version to the market addon.

Sorry but it's not stable on my test site so i'm not in a position to post as add-on.

 

Link to comment
Share on other sites

46 minutes ago, Mikepo said:

Thank you, that was the missing bit, I'm not a javescript expert, so that fixed it. 😊

Hello Mike @Mikepo

So only with that change did you manage to make the addon work or did you have to make some other change?

 

Best regards

Valqui

:heart: Community Oscommerce fan :heart: You'll find the latest osC community version here.

 

Link to comment
Share on other sites

these are the changes that i have made

includes/modules/content/footer/cm_footer_popup.php

change line 63 to

include('includes/modules/content/' . $this->group . '/templates/popup.php');

includes/modules/content/footer/templates/popup.php change whole file to

<?php
if (!tep_session_is_registered('popup')) { ?>        
<div class="modal fade" id="popupModal">  
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
<div class="modal-body">
      <center><h5><?php echo $popup_string; ?></h5></center>
     </div>
        <div class="modal-footer">
        <button type="button" class="btn btn-default pull-right" data-dismiss="modal"> <?php echo IMAGE_BUTTON_CONTINUE;?> <span class="glyphicon glyphicon-chevron-right"></span></button>
        </div>
      </div>
     </div>
    </div>

<?php
tep_session_register('popup');
 $oscTemplate->addBlock("<script>
    $(window).on('load',function(){
        $('#popupModal').modal('show');
    });
</script>", 'footer_scripts');
  }
?>

putting the java script in the add block allows it to be added to where it is needed 

 

remember that it will only show once per session, 

so on each test i cleared my cookie for my test site to get it to appear again

 

Phoenix support now at https://phoenixcart.org/forum/
App created for phoenix
TinyMCE editor for admin

 

Link to comment
Share on other sites

Was not able to get stable working with any of the changes. As soon as other scritps are run stops working. The issue is only the "show" function as with "on click" even original code works fine. I think bootstrap modal with "show" is just not that stable.

I'm going to look to replace with simple js alert box.

 

Link to comment
Share on other sites

I have had mixed results with the Modal version, same code installed on 4 test sites works on 1 clean install but not on the other 3?

In comparison the "alert" version works on all 4. The only thing I can pin this down to is the Modal show which is flaky at best. It's strange how simply replacing "show" with click or fade works every time.

I don't think it has anything to do with add-on code as i'm using it for the alert version and it works fine. It's all to do with modal show.

Never mind if it works use it if not just replace Modal with alert.

 

Link to comment
Share on other sites

23 hours ago, Mikepo said:

package uploaded

Works fine, found the problem was a duplication of  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

If you have this called twice then "Modal Show" will not be stable. Removed second js from an old add-on and it worked fine.

No need to edit template bottom this works fine to add script to template_bottom.

 <?php    
tep_session_register('popup');
 $oscTemplate->addBlock("<script>
    $(window).on('load',function(){
        $('#popupModal').modal('show');
    });
</script>", 'footer_scripts');
  }
?>

 

 

Link to comment
Share on other sites

@JcMagpie what is your opinion on the size of the modal popup.

i managed to change it either by adding modal-lg (which makes it 900px wide instead of 600px) after modal-dialog

or by adding modal-custom  then adding at the bottom of the script

<style>
.modal-custom { width:80%; } 
</style>

 

Phoenix support now at https://phoenixcart.org/forum/
App created for phoenix
TinyMCE editor for admin

 

Link to comment
Share on other sites

better to just use bootstrap I would think, <div class="modal-dialog modal-sm">

or

modal-lg

modal-xl

It all depends what you are going to use it for, If just info like "we are closed" small will do, if you decide to use it for promotion then large is best.

Simply change the footer code to allow user to select size to display in admin.

 

Link to comment
Share on other sites

19 minutes ago, JcMagpie said:

better to just use bootstrap I would think, <div class="modal-dialog modal-sm">

or

modal-lg

modal-xl

It all depends what you are going to use it for, If just info like "we are closed" small will do, if you decide to use it for promotion then large is best.

Simply change the footer code to allow user to select size to display in admin.

something i did in the pas was to use something like

modal-<?php echo POPUP_MODAL_WIDTH; ?>

which i could change in the admin to make it bigger/smaller

Phoenix support now at https://phoenixcart.org/forum/
App created for phoenix
TinyMCE editor for admin

 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...