Jump to content
design-a-point

p.events corporate website

Recommended Posts

Hi,

a while ago, we redesigned the corporate identity for the event- and catering agency p.events Event & Catering oHG based in Germany.
Along with the new corporate design we also developed a new website based on ProcessWire 2.7:

http://www.p-events.de

pevents_website.jpg

 

The website's current focus is the presentation of p.event's services and therefore makes use of many images. It is planned to extend the website with a blog and a more sophisticated inquiry form in the future.

The website is fully responsive (including images with srcset), uses free-flow image sliders and some CSS3 features like animations.

 

We're looking forward to your feedback :)

 

Cheers

Alex

  • Like 8

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By flydev 👊🏻
      Bootstrap-4 Minimal site profile for ProcessWire
      This profile is based on the "minimal site profile (intermediate edition)" and bundled with Boostrap v4.4.1
       
        Features
      Bootstrap SASS Font-Awesome SASS Render / helper functions for : Simple ul navigation Bootstrap Multi-level navbar Bootstrap Carousel Bootstrap Cards Bootstrap Jumbotron Boostrap Accordion Assets minification, files bundle   Dependencies
      jQuery Popper.js Bootstrap FontAwesome   Prequisites
       You'll want to install the following on your system before proceeding:
      Yarn / NPM How To Install
      Download the zip file at Github or clone directly the repo with git clone and skip the step 2. Extract the folder site-pwbs4-master into a fresh ProcessWire installation root folder. During the installation of ProcessWire, choose the profile "ProcessWire Bootstrap 4 profile".   After installation
      You can find the development file (CSS/SCSS/JS) in site/assets/dev/src
      The profile can be used as is only with $config->debug set to false. To use it in debug mode, you are required to install the dependencies with the package manager.
      Open a terminal in site/assets/dev and execute the following command-line: yarn Available commands :
      Rebuild, minify and bundle assets for release : yarn build   References
      Bootstrap v4 documentation ProcessWire documentation ProcessWire Forum: bootstrap tag ProcessWire Forum: bootstrap related posts   Credits
      The ProcessWire staff Inspiration from @gebeer and his Bootstrap 3 profile post Members who contributed in various post about Bootstrap navigation and code (see code-source for refs). Screenshots

    • By schwarzdesign
      We recently finished the relaunch auf camac.de, a client from the software industry, focused on controlling and business integration solutions. Concept, design and implementation by schwarzdesign.
      The site is focussed on longer content pages with text and image combination, with technical information for potential customers. It also offers multiple options for Call-to-Action elements to maximize conversions. Finally, the site is heavily optimized with caching and minification at every stop to be instantly readable even on slow connections.
      Features
      No hard-coded sections in any template: Almost all content types use the same repeater matrix field with several section types. This way, the entire site and all parts of the layout can be moved around and combined in any way imaginable. Custom Call-to-Action options: Two different contact forms, custom external links or a general CTA text. Automatically generated page navigation and human-readable anchors (as seen here) Every page fully loaded and interactive in ~1 second, even on poor mobile connections Automatically generated SEO meta tags, with overwrite fields available on every page Modules used
      ProFields FormBuilder Tracy Debugger Sitemap Duplicator ALIF - Admin Links In Frontend WireMailSMTP Content and conversions
      Every visitor is a potential customer - this is why we made sure there are ample opportunities to generate leads. At the end of every page, there are multiple options for the CTA section:
      A contact form with a customizable message (built with FormBuilder) A download form that allows visitors to download PDFs (e.g. the full article) in exchange for their name and E-Mail address. Other text + image combinations with custom links or buttons. The download form was custom coded, as it allows the editor to upload a file specific to the current page and make it available behind a small form. After successfully submitting the form, an e-mail is sent to the site owner, and the file is directly streamed to the client as a download.
      Technical insights
      This is one of the first pages where I used Twig for templating, and it's been a great developing experience. With Twig, you get content escaping and much better seperation between logic and view / display. I also spent some time working out a solid structure for the twig templates, with useful defaults, reusable blocks for page and section template (you can read more about the approach in my recent tutorial on integrating Twig with ProcessWire, part 1 and part 2).
      I also started using Parcel as a lightweight alternative for Webpack, when all I need is to compile a couple of small scripts (for the navigation, the lightbox, a dismissable cookie notice et c). What's great about parcel is that you get bundling of your own code and external libraries out of the box, as well as ES6+ transpilation and minification for production usage. Still, it required no configuration but a couple of command line options. This way, you get one bundled, minified JavaScript file, the same way we produce a minified CSS file with SCSS, but without the additional overhead of configuring Webpack.
      Screenshots











    • By Marcel
      Hey, 
      I am very new to processwire and bootstrap. I have a field (text area) and there I want to be able to insert an image which is responsive. I tryed it with Source but in the end the page doesn't seem to like it when I insert in Source the following code
      <img src="<?php echo $homepage->content_img->url; ?>" class="img-fluid" alt="Responsive image"> What can I do to make it possible to insert reponsive images in a text area?
      Thank you in advance.
      Marcel
    • By Clément Lambelet
      Hi all,
       
      I'm really new to ProcessWire, maybe I missed the solution in the documentation.
      I'm working on a site which involves a lot of image upload fields, and I'm always getting many timeout errors. I'm pretty sure it's because I generate too many variations on a single page load (around 20 images with 7 different sizes, for them to be responsive).
      I can't use ImageSizerEngineIMagick to help (my host doesn't support it).
       
      I was wondering if there was a way to hook to the process of client-side image resizing (https://processwire.com/blog/posts/processwire-3.0.63-adds-client-side-image-resizing/) to generate the different variations (as it seems really faster). If not, is there a way to generate the different variations on upload and not on page load ?
       
      Any ideas and suggestions are welcome!
    • By abdus
      While I was reading Smashing Magazine, I discovered this handy tool called XRespond that lets you load webpages in iframes that are designed to simulate different devices, (similar to how browsers' mobile simulators work).
      I think it's quite useful for local development. In fact it works for any website as long as it doesnt have `X-Frame-Options` headers set to `sameorigin`. I highly recommend using it with browser-sync with live loading as well. I use this settings when using it with PHPStorm to live reload my dev site on pw.dev.
      // remember set cwd to /site/templates/ or call it from templates directory path/to/browser-sync.cmd start --proxy pw.dev --port 8080 --files "**/*.php" --files "assets/**/*.css" --files "assets/**/*.css"
      What other tools/utilities do you use for testing your responsive designs?
×
×
  • Create New...