establish base code

css/fw-store-embed.css

@@ -0,0 +1,37 @@
+.fw-store-parent {
+    align-content: center;
+    vertical-align: top;
+    overflow-y: auto;
+    text-align:center;
+    margin:0 auto;
+    max-width: 1000px;
+}
+
+.product-tile {
+    align-content: center;
+    vertical-align: top;
+    background: white;
+    display:inline-block;
+    width:200px;
+    margin:0 25px 25px;
+    
+}
+
+.product-tile img {
+    max-height: 350px;
+}
+
+.image__badges {
+    color: red;
+    justify-content: center;
+    position: absolute;
+    font-weight: bold;
+    margin: auto;
+}
+.badge {
+    color: red !important;
+    margin: auto;
+    padding: 60px;
+    font-size: 20px;
+    font-style: italic;
+}

fw-store-embed.php

@@ -0,0 +1,18 @@
+<?php
+/**
+ * Plugin Name: Fourthwall Store Embed
+ * Plugin URL: https://cybercove.io/
+ * Description: Embed Fourthwall Store in WordPress
+ * Version: 1.0.0.
+ * Author: Joshua Knapp
+ * Text Domain: fourthwall_text_domain
+ *
+ */
+
+include("libs/settings.php");
+include("libs/shortcode.php");
+function set_fw_store_embed_css() {
+    wp_enqueue_style('fw-embed-style', plugin_dir_url( __FILE__ ). 'css/fw-store-embed.css', array(),null);
+}
+
+add_action( 'wp_enqueue_scripts', 'set_fw_store_embed_css' );

libs/settings.php

@@ -0,0 +1,87 @@
+<?php
+
+class fourthwall_settings {
+
+	public function __construct() {
+
+		add_action( 'admin_menu', array( $this, 'add_admin_menu' ) );
+		add_action( 'admin_init', array( $this, 'init_settings'  ) );
+
+	}
+
+	public function add_admin_menu() {
+
+		add_menu_page(
+			esc_html__( 'Fourthwall Store Embed', 'fourthwall_text_domain' ),
+			esc_html__( 'FourthWall Embed', 'fourthwall_text_domain' ),
+			'manage_options',
+			'fwembed',
+			array( $this, 'fourthwall_page_layout' ),
+			'dashicons-store',
+			10
+		);
+
+	}
+
+	public function init_settings() {
+
+		register_setting(
+			'fourthwall_settings_group',
+			'fourthwall_settings_name'
+		);
+
+		add_settings_section(
+			'fourthwall_settings_name_section',
+			'',
+			false,
+			'fourthwall_settings_name'
+		);
+
+		add_settings_field(
+			'fourth_url',
+			__( 'Store URL', 'fourthwall_text_domain' ),
+			array( $this, 'render_fourth_url_field' ),
+			'fourthwall_settings_name',
+			'fourthwall_settings_name_section'
+		);
+
+	}
+
+	public function fourthwall_page_layout() {
+
+		// Check required user capability
+		if ( !current_user_can( 'manage_options' ) )  {
+			wp_die( esc_html__( 'You do not have sufficient permissions to access this page.', 'fourthwall_text_domain' ) );
+		}
+
+		// Admin Page Layout
+		echo '<div class="wrap">' . "\n";
+		echo '	<h1>' . get_admin_page_title() . '</h1>' . "\n";
+		echo '	<form action="options.php" method="post">' . "\n";
+
+		settings_fields( 'fourthwall_settings_group' );
+		do_settings_sections( 'fourthwall_settings_name' );
+		submit_button();
+
+		echo '	</form>' . "\n";
+		echo '</div>' . "\n";
+
+	}
+
+	function render_fourth_url_field() {
+
+		// Retrieve data from the database.
+		$options = get_option( 'fourthwall_settings_name' );
+
+		// Set default value.
+		$value = isset( $options['fourth_url'] ) ? $options['fourth_url'] : '';
+
+		// Field output.
+		echo '<input type="url" name="fourthwall_settings_name[fourth_url]" class="regular-text fourth_url_field" placeholder="' . esc_attr__( 'https://some-shop.fourthwall.com', 'fourthwall_text_domain' ) . '" value="' . esc_attr( $value ) . '">';
+		echo '<p class="description">' . __( 'The fourth wall URL', 'fourthwall_text_domain' ) . '</p>';
+
+	}
+
+}
+
+new fourthwall_settings;

libs/shortcode.php

@@ -0,0 +1,57 @@
+<?php
+
+function fwembed_parse_html($url = null) {
+  if ($url === null) {
+    throw new ValueError("Missing URL");
+  }
+  $html = null;
+  $dom = new DOMDocument();
+  @$dom->loadHTML(file_get_contents($url));
+  $dom->documentURI = $url;
+  $divs = $dom->getElementsByTagName('div');
+  foreach ($divs as $div) {
+    if ($div->hasAttribute('data-testid') && $div->getAttribute('data-testid') === 'product') {
+      $xpath = new DOMXPath($dom);
+      
+      $tileItem = $xpath->query('.//img[contains(@class, "tile__item--1") 
+                                and not(contains(@class, "badge")) 
+                                and not(contains(@class, "tile_options"))
+                                and not(contains(@class, "tile__item--2"))]', $div);
+      $tileDesc = $xpath->query('.//*[contains(@class, "tile__description") 
+                                and not(contains(@class, "badge")) 
+                                and not(contains(@class, "tile_options"))]', $div);
+      $tileHeading = $xpath->query('.//*[contains(@class, "tile__heading") 
+                                   and not(contains(@class, "badge")) 
+                                   and not(contains(@class, "tile_options"))]', $div);
+      $tilePrices = $xpath->query('.//*[contains(@class, "tile__prices") 
+                                  and not(contains(@class, "badge")) 
+                                  and not(contains(@class, "tile_options"))]', $div);
+      $productHTML = '';
+      if ($tileItem->length > 0) {
+        $productHTML .= $dom->saveHTML($tileItem->item(0));
+      }
+      if ($tileDesc->length > 0) {
+        $productHTML .= $dom->saveHTML($tileDesc->item(0));
+      }
+      if ($tileHeading->length > 0) {
+        $productHTML .= $dom->saveHTML($tileHeading->item(0));
+      }
+      if ($tilePrices->length > 0) {
+        $productHTML .= $dom->saveHTML($tilePrices->item(0));
+      }
+
+      $html = $html . '<div class="product-tile">' . $productHTML . '</div>';
+    }
+  }
+  $html = str_replace('a href="', 'a target="_blank" href="' . $url, $html);
+  return $html;
+}
+
+function fwembed_shortcode( $atts ) {
+  $options = get_option( 'fourthwall_settings_name' );
+  $value = isset( $options['fourth_url'] ) ? $options['fourth_url'] : 'https://latinosagainstspookyshit-shop.fourthwall.com';
+  $store_html = fwembed_parse_html($value);
+  $store_render = '<div class="fw-store-parent">' . PHP_EOL . $store_html . PHP_EOL . '</div>';
+  return $store_render;
+}
+add_shortcode( 'fourthwall', 'fwembed_shortcode' );