Announcement

Collapse
No announcement yet.

Shipping options as radio buttons in Swift

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Shipping options as radio buttons in Swift

    Hi everyone. Has anyone tried to change how the shipping options are displayed in the swift template? I would like to display them as radio buttons instead of a dropdown.

    I followed the KB article https://community.sellerdeck.com/for...-radio-buttons but alas it didn't work and i had to change it back.

    Does anyone know if the code in that KB article needs changing for Swift?

    Cheers, Adam

    #2
    I'd like to know this too. Customers need to see all the shipping options, otherwise they'll often just go with the default.

    John
    John Ennals
    www.tortoys.co.uk

    Comment


      #3
      I think I have cracked it.

      The new input lines have single quotes not double ones.

      name=ShippingClass has NO quotes

      There is also a DPD paragraph which I changed more in hope than being sure what I was doing!

      Here is my revison in full:

      This is 'ShippingTemplate.pl', which you will find within your 'ShipControl' folder. Open the file in Notepad or an equivalent text editor.

      Look for this line

      Code:
      $sSelectHTML = "<SELECT ID='lstClass' NAME='ShippingClass'>\n";
      Change it to (ie: comment out)

      Code:
      # $sSelectHTML = "<SELECT ID='lstClass' NAME='ShippingClass'>\n";
      Next, look for this line

      Code:
      $sSelectHTML .= "</SELECT>\n";
      and replace it with (ie: comment out)

      Code:
      # $sSelectHTML .= "</SELECT>\n";
      Next, look for

      Code:
      'SELECTED ':
      and replace it with

      Code:
      'checked="checked" ':
      Look for

      Code:
      $sSelectHTML .= sprintf("<OPTION %s Value='%s'%s data-filter='%s'>%s\n",
      Change to:

      Code:
      #$sSelectHTML .= sprintf("<OPTION %s Value='%s'%s data-filter='%s'>%s\n",
      $sSelectHTML .= sprintf("< type='radio' name=ShippingClass data-filter='%s' %s value='%s'>%s<br />\n",
      Look for
      Code:
      $sSelectHTML .= sprintf("<OPTION %s Value='%s'>%s\n",
      Change to:

      Code:
      #$sSelectHTML .= sprintf("<OPTION %s Value='%s'>%s\n",
      $sSelectHTML .= sprintf("<input type='radio' name=ShippingClass %s value='%s'>%s<br />\n",
      Try it at https://www.gpxdev.co.uk/ship/ - (choose invoice with order).

      All without warranty etc and in good will.
      Jonathan Chappell
      Website Designer
      SellerDeck Website Designer
      Actinic to SellerDeck upgrades
      Graphicz Limited - www.graphicz.co.uk

      Comment


        #4
        Hi Jonathan, great, many thanks for having a look at this. I will give this a go shortly, and will report back - I appreciate you posting a solution.

        Cheers, Adam

        Comment


          #5
          Your solution works very well, Jonathan. Thanks. The options look much better laid this way and better for the customer as they can see what is available.
          Adam

          Comment


            #6
            Originally posted by graphicz View Post
            I think I have cracked it.

            The new input lines have single quotes not double ones.

            name=ShippingClass has NO quotes

            There is also a DPD paragraph which I changed more in hope than being sure what I was doing!

            Here is my revison in full:

            Look for this line

            Code:
            $sSelectHTML = "<SELECT ID='lstClass' NAME='ShippingClass'>\n";
            Change it to (ie: comment out)

            Code:
            # $sSelectHTML = "<SELECT ID='lstClass' NAME='ShippingClass'>\n";
            Next, look for this line

            Code:
            $sSelectHTML .= "</SELECT>\n";
            and replace it with (ie: comment out)

            Code:
            # $sSelectHTML .= "</SELECT>\n";
            Next, look for

            Code:
            'SELECTED ':
            and replace it with

            Code:
            'checked="checked" ':
            Look for

            Code:
            $sSelectHTML .= sprintf("<OPTION %s Value='%s'%s data-filter='%s'>%s\n",
            Change to:

            Code:
            #$sSelectHTML .= sprintf("<OPTION %s Value='%s'%s data-filter='%s'>%s\n",
            $sSelectHTML .= sprintf("< type='radio' name=ShippingClass data-filter='%s' %s value='%s'>%s<br />\n",
            Look for
            Code:
            $sSelectHTML .= sprintf("<OPTION %s Value='%s'>%s\n",
            Change to:

            Code:
            #$sSelectHTML .= sprintf("<OPTION %s Value='%s'>%s\n",
            $sSelectHTML .= sprintf("<input type='radio' name=ShippingClass %s value='%s'>%s<br />\n",
            Try it at https://www.gpxdev.co.uk/ship/ - (choose invoice with order).

            All without warranty etc and in good will.
            Thank you so much, it works a charm, been batting my request forward and backwards with TechS with no fix, guess they have to earn their wages somehow. Just paid our annual, next year I'll get one of you guys to take care of everything.

            Comment


              #7
              If you would prefer tick boxes reference Font-Awesome in the head code:

              Code:
              <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
              And add this to the style sheet:

              Code:
              .shipping-class input[type=radio] {
              -moz-appearance: none;
              -webkit-appearance: none;
              -o-appearance: none;
              outline: none;
              content: none;
              margin-left: 5px;
              }
              
              .shipping-class input[type=radio]:before {
              font-family: "FontAwesome";
              content: "\f00c";
              font-size: 25px;
              color: transparent !important;
              background: #fff;
              width: 25px;
              height: 25px;
              border: 1px solid #eee;
              margin-right: 5px;
              cursor: pointer;
              }
              
              .shipping-class input[type=radio]:checked:before {
              color: <actinic:variable name="PaletteBG" />!Important;
              }
              Jonathan Chappell
              Website Designer
              SellerDeck Website Designer
              Actinic to SellerDeck upgrades
              Graphicz Limited - www.graphicz.co.uk

              Comment

              Working...
              X