Jump to content

dotnetic

Members
  • Posts

    1,057
  • Joined

  • Last visited

  • Days Won

    15

dotnetic last won the day on November 16 2023

dotnetic had the most liked content!

Contact Methods

  • Website URL
    https://dotnetic.de
  • Skype
    jens.martsch

Profile Information

  • Gender
    Male
  • Location
    Münster, Germany

Recent Profile Visitors

14,272 profile views

dotnetic's Achievements

Hero Member

Hero Member (6/6)

1.2k

Reputation

  1. Hey @Leftfield I have a very wide monitor on which the display of the header on the homepage does not look good:
  2. The collaboration between dotnetic and Fugamo highlights the importance of a well-designed, efficient website for attracting and retaining customers. Fugamo, a provider of custom clothing for schools, clubs, and organizations, faced significant challenges with their old website. Slow load times, outdated design, and cumbersome content management were major issues that hindered customer engagement and conversions. The Challenge Fugamo's primary goal was to present their product offerings effectively, but their old website's sluggish performance and unattractive design made it difficult for potential customers to explore and make inquiries. Additionally, the absence of a wishlist feature complicated the user experience, leading to a lower conversion rate. The content management system (CMS) in place was inflexible, making it hard for Fugamo to update and create new content efficiently. The Solution Design Overhaul: We prioritized a visually appealing design to engage Fugamo's target audience — students, schools, and clubs. The new design incorporates vibrant colors, dynamic graphics, and interactive elements like an animated header. This not only enhances user experience but also strengthens Fugamo's brand identity and emotional connection with visitors, increasing the likelihood of customer loyalty. Centralized Content Management: A key improvement was the integration of a centralized interface, streamlining the management of both the website and the online shop. This ensures that new products can be added quickly and efficiently, keeping the website up-to-date without redundant manual updates across multiple platforms. Mobile Optimization: We implemented a responsive design ensuring the website performs well on all devices. This approach guarantees a seamless user experience regardless of the device used, addressing the needs of a mobile-savvy audience. Wishlist Feature: To enhance user interaction, a wishlist feature was introduced. This allows users to mark products of interest and include them in their inquiries through the contact form, simplifying the process and encouraging more customer engagement. Flexible Pagebuilder: We incorporated a flexible pagebuilder tool (RockPageBuilder), enabling Fugamo to easily create and update content. This tool simplifies the management process, allowing for quick adaptations and additions, crucial for maintaining an up-to-date and engaging website. Live Search Integration: A live search function was added, providing instant results as users type their queries. This feature significantly improves user experience by making navigation and product discovery faster and more intuitive, which can increase user satisfaction and the likelihood of conversions. Techniques and Technologies Used ProcessWire CMS: We utilized ProcessWire, our favorite CMS known for its flexibility and power. The existing e-commerce system is also based on ProcessWire, making it an ideal choice for seamless integration. Key Modules: Several ProcessWire modules were employed to enhance functionality: RockPageBuilder: For easy content creation and management. RockFrontend: Supports modern frontend development. RockMigrations: Facilitates field and template creation and data synchronization. FrontendForms: Simplifies form creation, management, and validation. SEOMaestro: Provides tools for creating sitemaps and managing Open Graph data. HTMX and AlpineJS: For drawers, navigation and live search PageimageSource: Optimizes image management and display. Latte Template Engine: Offers a powerful and secure template system. Outcomes and Impact The redesign and optimization efforts resulted in a significant improvement in website speed and user experience. Enhanced design elements and faster load times led to longer user sessions and reduced bounce rates. The introduction of the wishlist feature and improved content management increased the number of inquiries and conversions, helping Fugamo attract more schools, clubs, and students. Conclusion The Fugamo website revamp underscores the critical role of a modern, user-friendly website in business success. By addressing performance issues, implementing a captivating design, and enhancing content management, dotnetic helped Fugamo boost their online presence and customer engagement. This case study exemplifies the necessity of ongoing digital innovation to meet user needs and drive growth in the competitive online marketplace. For more details, visit the Fugamo Case Study (written in german).
  3. Hi @Juergen, another request from me. Would it be possible that the json file for different frameworks is located in site/templates/FrontendForms/frameworks instead of site/assets/files/FrontendForms/frameworks? The problem I have is that I excluded the assets/files/ directory in my gitignore file. So my tailwindcss.json file which lies there isn't processed by the compiler, as it is not part of the repository. So the styles for my forms are missing. What you think of that idea?
  4. Hey @bernhard. Did you think about pushing the footer down to stick always to the bottom? That might fix issue maybe. Nowadays it is easy to accomplish. Take a look at https://developer.mozilla.org/en-US/docs/Web/CSS/Layout_cookbook/Sticky_footers for example. If you don't want to use a wrapper, you can also use the body and set it to 100vh.
  5. Hello @Juergen since the update to the newest version I get extra br elements in a vertical radio button list. That looks ugly, is there any way I can prevent them? Thank you for all the other additions. I think I will need field dependencies in the future.
  6. Sure, I can do that, but it's very rudimentary and not optimized for all purposes (for example I did not use CAPTCHAS or other stuff). It also depends on classes like primary that I have defined in the colors option of my theme in the tailwind.config.js const colors = require("tailwindcss/defaultTheme"); module.exports = { theme: { colors: ({ colors }) => ({ primary: "#E85E27", secondary: "#89508e", black: "#000", white: "#ffffff", accent: "#c64511", transparent: "transparent", neutral: "#ffffff", info: "#ffffff", success: "#10b981", warning: "#f37f1e", error: "#e11d48", current: "currentColor", gray: colors.gray, slate: colors.slate, darkgray: "#1F2227", }) }; Please also note that you want to add the path to the file to the content section in your tailwind.config.js so the parser sees which classes to compile: content: [ './dist/site/templates/*.{php,latte}', './dist/site/modules/FrontendForms/CSSClasses/*.json', './dist/site/templates/RockForms/Renderer/*.php', './dist/site/templates/RockForms/*.{php,latte}', './dist/site/templates/partials/**/*.latte', './dist/site/templates/RockPageBuilder/blocks/**/*.{php,latte}', './src/js/*.js', ], I also wanted to add that it might be better to store these styling files under site/templates/FrontendForms/, as I think they would be customized for every project. Right now, when I do a module update they would be overwritten. tailwindcss.json
  7. Sure. Here is how I did it before in another Forms module. It uses alpinejs to generate the items $form->addMarkup("<p class='mt-5'>Artikel auf deiner Wunschliste:</p>"); $form->addMarkup('<template x-for="item in $store.cart.cart" :key="item.id" n:syntax="double" x-data>'); $form->addMarkup('<div class="">'); $form->addMarkup('<p x-text="`${item.id} (${item.number})`" class=""></p>'); $form->addMarkup('<input type="hidden" name="wunschliste[]" :value="item.id" class=""></input>'); $form->addMarkup('</div>'); $form->addMarkup('</template>');
  8. I feel you. Same here. Is there any possibilty to add custom markup with hidden fields into the form? Thats because I have shopping cart and its items are only stored in the browser local storage. So i want to dynamically inject them into the form, but that would only be possible if I can add custom markup.
  9. Yes, but this would not fix the problem as you would have a select field with tens of thousands of options, which would be unusable. Thanks, that helps for now. The problem is the line https://github.com/juergenweb/FrontendForms/blob/main/Formelements/Inputelements/Inputfields.php#L238 which just converts the setting "10M" to 10 and then multiplicates this by 1024 which would be 100 kilobytes without taking care of the letter M which stands for Megabytes. There might be other settings like G for gigabytes. The strange thing is, that the PHP documentation mentions that this value is an integer, but shows that the default value is "2M". ?
  10. Hello @Juergen. First of all I want to thank you for releasing this module for free. I can tell from the code, that A LOT of work went into it. I want to make some suggestions for improvement, as I stumbled across some errors or hickups that occured in my setup. I am using FrontendForms 2.2.2 and ProcessWire 3.0.235. Module settings timeout with many pages After the first install of the module and trying to go to the modules settings, the page loaded forever and then timed out. I figured, that the timeout results while trying to get the selectable pages for the data privacy page: https://github.com/juergenweb/FrontendForms/blob/main/FrontendForms.module#L1831-L1840 As I have some tens of thousands of pages it takes too long to process. So I changed the code to use a PageListSelect (treemenu) instead, which I think is much better. // Select the data privacy page $dataPrivacySelect = $this->wire('modules')->get('InputfieldPageListSelect'); $dataPrivacySelect->attr('name', 'input_privacy'); $dataPrivacySelect->label = $this->_('Privacy policy page'); $dataPrivacySelect->description = $this->_('Select the page which contains your privacy policy.'); $dataPrivacySelect->notes = $this->_('The link to this page will be used inside the Privacy class for generating the "Accept the privacy policy" checkbox.'); $dataPrivacySelect->parent_id = 1; // Set this to the ID of the parent page you want to start the tree from What you think of that? Placeholders in email don't work Then I tried to use the placeholder functionality for the emails, but the placeholders don't get replaced. I attached my form to this post, so you can replicate it. Is there anything else I need to setup, to get them replaced? Did I miss some instructions? I took the example from https://github.com/juergenweb/FrontendForms/blob/main/Examples/contactformWithWireMailSMTPModule.php and this is the result: File Upload Size does not work correctly I have a file upload in my form, and want to set a custom max filesize. So I used the rule $fileUpload->setRule('allowedFileSize', 2028); and get the output "Custom Filesize Please do not upload files larger than 2,0 kB" which is correct. Now I want to set this to 10 megabytes which would be 10 * 1024 * 1024. As soon as I try to set this as the rule, it is falling back to an incorrect read upload_max_filesize from the php.ini. The value set in my php.ini is 100M (megabytes) So after setting the rule to $fileUpload->setRule('allowedFileSize', 10 * 1024 * 1024); I get the notice under the file upload field "Please do not upload files larger than 100,0 kB" which is wrong. It should either be the 10MB that I set in my rule, or the 100M that is set in the php.ini file. Thank you in advance for your answer. If you like to discuss personally, we can schedule a call. I would be happy to get to know you. Another thing: I made my own TailwindCSS adapter which was very easy, with the json files for the other frameworks as a base. contact.php
  11. I used different approaches on different websites, but wouldn't say that one is right or wrong. On the site https://techland.org/network/ I have chosen to display them as an infinite self-scrolling carousel, you can even hover over the logos to pause and go to the website of the partner (all done with pure CSS). Advantage: You don't get a long vertical list of logos. Disadvantage: You can not see all logos at once, but that would also be the case if you use a vertical list. On https://digital-summit.eu/de/partner/ I used a static vertical list on mobile.
  12. Added support for PageFrontEdit for the TinyMCE plugin. Now you can save your TinyMCE fields on the frontend via CMD-S (or CTRL-S). Works great in conjunction with RockFrontend and RockPageBuilder. quicksave-frontend.mp4 QuickSave.zip
  13. Just came across https://www.namviek.com/ today, maybe this is what you are looking for. Don't know about the tech-stack.
  14. Hey @Chris-PW I added some optimizations to the scripts. First, now on install the QuicksaveTinyMCE plugin is automatically added to the list of plugins for TinyMCE and removed on uninstalling the module. You still have to add it to the indiviual fields, where you want to use it, maybe this could be done automatically in the future. Second I hope that I fixed the meta key issue and double save issue when using the TinyMCE plugin. I could not test it on a Mac, as browserstack has some hickups, so I appreciate everybodys feedback if it works. QuickSave.zip
×
×
  • Create New...