development 2.1.4d10 with 3 new stylesheets to fix layout in page, derived from Hello Elementor under GPLv3. Need to post on forum.

git-svn-id: https://plugins.svn.wordpress.org/footnotes/trunk@2431872 b8457f37-d9ea-0310-8a92-e5e31aec5664

class/dashboard/subpage-main.php

@@ -12,7 +12,7 @@
  * 2.1.1  options for ref container and alternative tooltips  2020-11-16T2152+0100
  * 2.1.4  settings for ref container and tooltips  2020-12-03T0950+0100
  *
- * Last modified: 2020-12-04T0206+0100
+ * Last modified: 2020-12-04T2230+0100
  */
 
 /**
@@ -123,6 +123,13 @@ class MCI_Footnotes_Layout_Settings extends MCI_Footnotes_LayoutEngine {
             "post_end" => __("at the end of the post", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
             "widget" => __("in the widget area", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)
         );
+        // basic responsive page layout options:
+        $l_arr_PageLayoutOptions = array(
+            "none" => __("Don’t fix the layout", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
+            "container" => __("to the references container", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
+            "main" => __("from the post title to the references container", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
+            "body" => __("to the whole page", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)
+        );
         // options for the separating punctuation between backlinks:
         // Unicode names are conventionally uppercase.
         $l_arr_Separators = array(
@@ -162,6 +169,13 @@ class MCI_Footnotes_Layout_Settings extends MCI_Footnotes_LayoutEngine {
                 "label-collapse" => $this->addLabel(MCI_Footnotes_Settings::C_BOOL_REFERENCE_CONTAINER_COLLAPSE, __("Collapse references by default", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
                 "collapse" => $this->addSelectBox(MCI_Footnotes_Settings::C_BOOL_REFERENCE_CONTAINER_COLLAPSE, $l_arr_Enabled),
 
+                "label-position" => $this->addLabel(MCI_Footnotes_Settings::C_STR_REFERENCE_CONTAINER_POSITION, __("Where shall the reference container appear", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
+                "position" => $this->addSelectBox(MCI_Footnotes_Settings::C_STR_REFERENCE_CONTAINER_POSITION, $l_arr_Positions),
+
+                "label-page-layout" => $this->addLabel(MCI_Footnotes_Settings::C_STR_FOOTNOTES_PAGE_LAYOUT_SUPPORT, __("Apply basic responsive page layout", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
+                "page-layout" => $this->addSelectBox(MCI_Footnotes_Settings::C_STR_FOOTNOTES_PAGE_LAYOUT_SUPPORT, $l_arr_PageLayoutOptions),
+                "page-layout-comment" => __("Most themes don’t need this fix.", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
+
                 "label-startpage" => $this->addLabel(MCI_Footnotes_Settings::C_BOOL_REFERENCE_CONTAINER_START_PAGE_ENABLE, __("Display on start page too", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
                 "startpage" => $this->addSelectBox(MCI_Footnotes_Settings::C_BOOL_REFERENCE_CONTAINER_START_PAGE_ENABLE, $l_arr_Enabled),
 
@@ -178,9 +192,6 @@ class MCI_Footnotes_Layout_Settings extends MCI_Footnotes_LayoutEngine {
                 "3column" => $this->addSelectBox(MCI_Footnotes_Settings::C_BOOL_REFERENCE_CONTAINER_3COLUMN_LAYOUT_ENABLE, $l_arr_Enabled),
                 "3column-comment" => __("This legacy layout is available if identical footnotes are not combined.", MCI_Footnotes_Config::C_STR_PLUGIN_NAME),
 
-                "label-position" => $this->addLabel(MCI_Footnotes_Settings::C_STR_REFERENCE_CONTAINER_POSITION, __("Where shall the reference container appear", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
-                "position" => $this->addSelectBox(MCI_Footnotes_Settings::C_STR_REFERENCE_CONTAINER_POSITION, $l_arr_Positions),
-
                 "label-separator" => $this->addLabel(MCI_Footnotes_Settings::C_BOOL_BACKLINKS_SEPARATOR_ENABLED, __("Add a separator when enumerating backlinks", MCI_Footnotes_Config::C_STR_PLUGIN_NAME)),
                 "separator-enable" => $this->addSelectBox(MCI_Footnotes_Settings::C_BOOL_BACKLINKS_SEPARATOR_ENABLED, $l_arr_Enabled),
                 "separator-options" => $this->addSelectBox(MCI_Footnotes_Settings::C_STR_BACKLINKS_SEPARATOR_OPTION, $l_arr_Separators),

class/init.php

@@ -12,8 +12,9 @@
  * 2.0.3  add versioning of public.css for cache busting   2020-10-29T1413+0100
  * 2.0.4  add jQuery UI from WordPress   2020-11-01T1902+0100
  * 2.1.4  automate passing version number for cache busting  2020-11-30T0646+0100
+ * 2.1.4  enqueue optionally an extra style sheet  2020-12-04T2231+0100
  * 
- * Last modified:  2020-12-01T0146+0100
+ * Last modified:  2020-12-04T2232+0100
  */
 
 
@@ -132,8 +133,10 @@ class MCI_Footnotes {
             wp_enqueue_script( 'jquery-ui-position' );
             wp_enqueue_script( 'jquery-ui-tooltip' );
 
-            // enqueue jQuery Tools:                            redacted jQuery.browser, completed minification; added versioning 2020-11-18T2150+0100
+			// enqueue jQuery Tools:
-            wp_enqueue_script('mci-footnotes-js-jquery-tools', plugins_url('../js/jquery.tools.min.js', __FILE__), '', '2.1.1');
+			// redacted jQuery.browser, completed minification; added versioning 2020-11-18T2150+0100
+			// not use '-js' in the handle, is appended automatically
+            wp_enqueue_script('mci-footnotes-jquery-tools', plugins_url('footnotes/js/jquery.tools.min.js'), array(), '1.2.7redacted');
 
 
             // Alternatively, fetch jQuery UI from cdnjs.cloudflare.com:
@@ -152,13 +155,16 @@ class MCI_Footnotes {
 
         //###  STYLES
 
-        // up-to-date plugin version number needed for cache busting:
+		// up-to-date plugin version number needed for cache busting:
-        wp_enqueue_style(
+		// not use '-css' in the handle, is appended automatically;
-            'mci-footnotes-css-public',
+		// constant FOOTNOTES_VERSION defined in footnotes.php, media all is default
-            plugins_url('../css/public.css', __FILE__),
+		wp_enqueue_style( 'mci-footnotes-public', plugins_url('footnotes/css/public.css'), array(), FOOTNOTES_VERSION, 'all' );
-            '',
-            FOOTNOTES_VERSION
-        );
-    }
 		
+		// optional layout fix for unsupportive themes:
+		// since 2.1.4   2020-12-04T2231+0100
+		$l_str_LayoutOption = MCI_Footnotes_Settings::instance()->get(MCI_Footnotes_Settings::C_STR_FOOTNOTES_PAGE_LAYOUT_SUPPORT);
+		if ($l_str_LayoutOption != 'none') {
+			wp_enqueue_style( 'mci-footnotes-public-' . $l_str_LayoutOption, plugins_url('footnotes/css/public-' . $l_str_LayoutOption . '.css'), array(), FOOTNOTES_VERSION, 'all' );
+	    }
+	}
 }

class/settings.php

@@ -19,7 +19,7 @@
  * 2.1.3  fix ref container positioning by priority level  2020-11-17T0205+0100
  * 2.1.4  more settings container keys  2020-12-03T0955+0100
  *
- * Last modified: 2020-12-03T1603+0100
+ * Last modified: 2020-12-04T2230+0100
  */
 
 
@@ -436,6 +436,7 @@ class MCI_Footnotes_Settings {
     const C_FLO_MOUSE_OVER_BOX_FONT_SIZE_SCALAR     = "footnotes_inputfield_mouse_over_box_font_size_scalar";
     const C_STR_MOUSE_OVER_BOX_FONT_SIZE_UNIT       = "footnotes_inputfield_mouse_over_box_font_size_unit";
 
+    const C_STR_FOOTNOTES_PAGE_LAYOUT_SUPPORT       = "footnotes_inputfield_page_layout_support";
 
 
     /**
@@ -478,6 +479,9 @@ class MCI_Footnotes_Settings {
             self::C_STR_REFERENCE_CONTAINER_POSITION => 'post_end',
             self::C_BOOL_COMBINE_IDENTICAL_FOOTNOTES => 'yes',
 
+            // whether to enqueue additional style sheet:
+            self::C_STR_FOOTNOTES_PAGE_LAYOUT_SUPPORT => 'none',
+
             self::C_BOOL_REFERENCE_CONTAINER_BACKLINK_SYMBOL_ENABLE => 'yes',
             self::C_BOOL_REFERENCE_CONTAINER_START_PAGE_ENABLE      => 'yes',
             self::C_BOOL_REFERENCE_CONTAINER_3COLUMN_LAYOUT_ENABLE  => 'no',
@@ -505,7 +509,10 @@ class MCI_Footnotes_Settings {
             // whether a <br /> tag is inserted:
             self::C_BOOL_BACKLINKS_LINE_BREAKS_ENABLED => 'no',
 
+            // whether to use link elements:
             self::C_BOOL_LINK_ELEMENT_ENABLED => 'yes',
+
+            // excerpt should be disabled:
             self::C_BOOL_FOOTNOTES_IN_EXCERPT => 'no',
 
             // since removal of the_post hook, expert mode is no danger zone

css/public-body.css

@@ -0,0 +1,77 @@
+/**
+ * Footnotes Responsive Layout for the body element
+ *
+ * Based on Hello Elementor v2.3.0 Basic responsive layout
+ * licensed under GNU General Public License v3 or later
+ * License URI: https://www.gnu.org/licenses/gpl-3.0.html
+ *
+ * Since 2.1.4
+ * Version: 2.1.4d10
+ *
+ * Last modified: 2020-12-04T1858+0100
+ */
+
+
+/***********************************************************
+Basic responsive layout
+
+In Hello Elementor Theme, this applies to .site-header, and
+also to .site-main, which is a class of the <main> element,
+at the condition that the page is not built with Elementor:
+    body:not([class*="elementor-page-"])
+Therefore, in pages built with Elementor, proper layout is
+applied only to features managed by Elementor, not others.
+
+The Footnotes references container is near the end of main.
+This style sheet lets Footnotes’ reference container come
+into the benefit of the basic responsive layout style rules
+that would apply if the page were not built with Elementor.
+
+This is mainly useful with Hello Elementor, but it might be
+used also with another theme depriving the features from
+other plugins of basic layout rules as applied to content.
+
+The enqueuing of this style sheet is optional. The setting
+is in the dashboard under Settings > Reference container.
+*/
+
+body, body.blog, body.page, body.page-template-default {
+    margin-right: auto;
+    margin-left: auto;
+}
+
+@media (max-width: 575px) {
+
+    body, body.blog, body.page, body.page-template-default {
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+}
+
+@media (min-width: 576px) {
+
+    body, body.blog, body.page, body.page-template-default {
+        max-width: 500px;
+    }
+}
+
+@media (min-width: 768px) {
+
+    body, body.blog, body.page, body.page-template-default {
+        max-width: 600px;
+    }
+}
+
+@media (min-width: 992px) {
+
+    body, body.blog, body.page, body.page-template-default {
+        max-width: 800px;
+    }
+}
+
+@media (min-width: 1200px) {
+
+    body, body.blog, body.page, body.page-template-default {
+        max-width: 960px;
+    }
+}

css/public-container.css

@@ -0,0 +1,77 @@
+/**
+ * Footnotes Responsive Layout for the reference container
+ *
+ * Based on Hello Elementor v2.3.0 Basic responsive layout
+ * licensed under GNU General Public License v3 or later
+ * License URI: https://www.gnu.org/licenses/gpl-3.0.html
+ *
+ * Since 2.1.4
+ * Version: 2.1.4d10
+ *
+ * Last modified: 2020-12-04T1843+0100
+ */
+
+
+/***********************************************************
+Basic responsive layout
+
+In Hello Elementor Theme, this applies to .site-header, and
+also to .site-main, which is a class of the <main> element,
+at the condition that the page is not built with Elementor:
+    body:not([class*="elementor-page-"])
+Therefore, in pages built with Elementor, proper layout is
+applied only to features managed by Elementor, not others.
+
+The Footnotes references container is near the end of main.
+This style sheet lets Footnotes’ reference container come
+into the benefit of the basic responsive layout style rules
+that would apply if the page were not built with Elementor.
+
+This is mainly useful with Hello Elementor, but it might be
+used also with another theme depriving the features from
+other plugins of basic layout rules as applied to content.
+
+The enqueuing of this style sheet is optional. The setting
+is in the dashboard under Settings > Reference container.
+*/
+
+.footnotes_reference_container {
+    margin-right: auto;
+    margin-left: auto;
+}
+
+@media (max-width: 575px) {
+
+    .footnotes_reference_container {
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+}
+
+@media (min-width: 576px) {
+
+    .footnotes_reference_container {
+        max-width: 500px;
+    }
+}
+
+@media (min-width: 768px) {
+
+    .footnotes_reference_container {
+        max-width: 600px;
+    }
+}
+
+@media (min-width: 992px) {
+
+    .footnotes_reference_container {
+        max-width: 800px;
+    }
+}
+
+@media (min-width: 1200px) {
+
+    .footnotes_reference_container {
+        max-width: 960px;
+    }
+}

css/public-main.css

@@ -0,0 +1,77 @@
+/**
+ * Footnotes Responsive Layout for the main element
+ *
+ * Based on Hello Elementor v2.3.0 Basic responsive layout
+ * licensed under GNU General Public License v3 or later
+ * License URI: https://www.gnu.org/licenses/gpl-3.0.html
+ *
+ * Since 2.1.4
+ * Version: 2.1.4d10
+ *
+ * Last modified: 2020-12-04T1857+0100
+ */
+
+
+/***********************************************************
+Basic responsive layout
+
+In Hello Elementor Theme, this applies to .site-header, and
+also to .site-main, which is a class of the <main> element,
+at the condition that the page is not built with Elementor:
+    body:not([class*="elementor-page-"])
+Therefore, in pages built with Elementor, proper layout is
+applied only to features managed by Elementor, not others.
+
+The Footnotes references container is near the end of main.
+This style sheet lets Footnotes’ reference container come
+into the benefit of the basic responsive layout style rules
+that would apply if the page were not built with Elementor.
+
+This is mainly useful with Hello Elementor, but it might be
+used also with another theme depriving the features from
+other plugins of basic layout rules as applied to content.
+
+The enqueuing of this style sheet is optional. The setting
+is in the dashboard under Settings > Reference container.
+*/
+
+main, .main-content, .site-main {
+    margin-right: auto;
+    margin-left: auto;
+}
+
+@media (max-width: 575px) {
+
+    main, .main-content, .site-main {
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+}
+
+@media (min-width: 576px) {
+
+    main, .main-content, .site-main {
+        max-width: 500px;
+    }
+}
+
+@media (min-width: 768px) {
+
+    main, .main-content, .site-main {
+        max-width: 600px;
+    }
+}
+
+@media (min-width: 992px) {
+
+    main, .main-content, .site-main {
+        max-width: 800px;
+    }
+}
+
+@media (min-width: 1200px) {
+
+    main, .main-content, .site-main {
+        max-width: 960px;
+    }
+}

css/public.css

@@ -4,9 +4,10 @@
  * Created-Date: 15.05.14
  * Created-Time: 16:21
  * Since: 1.0
- * Version: 2.1.4d9
  *
- * Last modified: 2020-12-04T0202+0100
+ * Version: 2.1.4d10
+ *
+ * Last modified: 2020-12-04T2234+0100
  */
 
 
@@ -154,6 +155,11 @@ Read-on button
 Footnote references container
 
 templates/public/reference-container.html
+
+Also optional responsive basic page layout support:
+public-container.css
+public-main.css
+public-body.css
 */
 
 /*

css/settings.css

@@ -4,9 +4,10 @@
  * Created-Date: 15.05.14
  * Created-Time: 16:21
  * Since: 1.0
- * Version: 2.1.4d9
  *
- * Last modified: 2020-12-04T0201+0100
+ * Version: 2.1.4d10
+ *
+ * Last modified: 2020-12-04T1718+0100
  */
 
 

footnotes.php

@@ -4,12 +4,12 @@
     Plugin URI: https://wordpress.org/plugins/footnotes/
     Description: time to bring footnotes to your website! footnotes are known from offline publishing and everybody takes them for granted when reading a magazine.
     Author: Mark Cheret
-    Version: 2.1.4d9
+    Version: 2.1.4d10
     Author URI: http://cheret.de/plugins/footnotes-2/
     Text Domain: footnotes
     Domain Path: /languages
 */
-define( 'FOOTNOTES_VERSION', '2.1.4d9' );
+define( 'FOOTNOTES_VERSION', '2.1.4d10' );
 /*
     Copyright 2020 Mark Cheret (email: mark@cheret.de)
 

js/jquery.tools.js

@@ -25,7 +25,7 @@
  * <https://wordpress.org/support/topic/tooltip-hover-not-showing/#post-13456762>
  * 
  * Removed usage of jQuery browser check function   2020-11-12T0127+0100
- * ‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾
+ *   ==> this is version 1.2.7redacted
  * See also on the Forum: <https://wordpress.org/support/topic/after-wp-5-5-upgrade-jquery-is-deprecated/>,
  * lastly <https://wordpress.org/support/topic/jquery-issues-13/>
  * 
@@ -44,7 +44,7 @@
  * #6 (420) This disabled slide-fade for Internet Explorer.
  *          Browsers not supporting an effect simply don’t execute it, they won’t throw an error.
  * 
- * Re-formatted minified file. Last modified: 2020-11-13T0444+0100
+ * Halfways minified file. Last modified: 2020-12-04T2140+0100
  */
 (function (a) {
 	a.tools = a.tools || {version: "v1.2.7"};

readme.txt

@@ -80,10 +80,11 @@ Visit this swift write-up from a **footnotes** user by the name of **Southwest**
 
 == Changelog ==
 
-= 2.1.4d9 =
+= 2.1.4d10 =
+- Bugfix: Reference container: fix theme-dependent layout issues by optionally enqueuing additional style sheet
 - Bugfix: Reference container: fix layout issues by moving backlink column width to settings
 - Bugfix: Reference container: separating and terminating punctuation optional and customizable
-- Bugfix: Styling: Tooltips: fix font size issue by moving it to settings and default it to legacy
+- Bugfix: Styling: Tooltips: fix font size issue by adding font size to settings with legacy as default
 - Bugfix: Reference container: Backlinks: optional line breaks to stack enumerations
 - Bugfix: Dashboard: move arrow settings from Customize to Settings > Reference container to reunite and fix issue with new heading wording
 - Bugfix: Dashboard: Main settings: fix layout, raise shortcodes to top
@@ -110,7 +111,6 @@ Visit this swift write-up from a **footnotes** user by the name of **Southwest**
 
 = 2.1.2 =
 - Bugfix: Layout: Reference container: Backlinks: no underline on hover cell when combining identicals is on
-- Bugfix: Elementor: add experimental support for section name function
 - Bugfix: Dashboard: priority level settings for all other hooks
 - Update: Dashboard: WordPress documentation URLs of the hooks
 - Update: Dashboard: feature description for the hooks priority level settings (not yet localized)

templates/dashboard/settings-reference-container.html

@@ -4,17 +4,21 @@
             <td>[[label-name]]</td>
             <td>[[name]]</td>
         </tr>
+        <tr>
+            <td>[[label-collapse]]</td>
+            <td>[[collapse]]</td>
+        </tr>
         <tr>
             <td>[[label-position]]</td>
             <td>[[position]]</td>
         </tr>
         <tr>
-            <td>[[label-startpage]]</td>
+            <td>[[label-page-layout]]</td>
-            <td>[[startpage]]</td>
+            <td>[[page-layout]] <em>[[page-layout-comment]]</em></td>
         </tr>
         <tr>
-            <td>[[label-collapse]]</td>
+            <td>[[label-startpage]]</td>
-            <td>[[collapse]]</td>
+            <td>[[startpage]]</td>
         </tr>
         <tr>
             <td>[[label-symbol]]</td>