[Resolved] create page designs with Elementor

Home Forums Support [Resolved] create page designs with Elementor

Home Forums Support create page designs with Elementor

Viewing 15 posts - 1 through 15 (of 25 total)
  • Author
    Posts
  • #210588
    Joanne Smith

    Hi
    To create page designs with Elementor, we use 3 types of elements: Sections, Columns and Widgets. Combining these elements lets you design and compose very complex web pages. You can control and edit the appearance of each of them.

    Have you seen this new plugin — ??? Do you think it is compatible with your theme ??

    It poppped up on my plugin screen when I was updating a plugin

    https://www.elementor.com

    looks very interesting and easy to use!!

    Joanne

    #210594
    Joanne Smith

    I have just been using it with your theme and it is compatible and one of the best and easy to use editors out there — more than just drop and drag — it is VERY advanced and more like dreamweaver with LIVE views with a touch of a button to see how the design layout is going !! Lots of great additional features — this reminds me so much of dreamweaver — for advanced users with CSS skills — !! The best this is you can create columns and borders and such the like at a touch of a button! So with your theme and this editor progam — I will be able to design even MORE advanced websites!!

    Take a look see –

    J

    #210615
    Tom
    Lead Developer
    Lead Developer

    Definitely a cool plugin! You can also create full width sections with it using our new Page Builder Integration metabox πŸ™‚

    #213867
    Joanne Smith

    hi

    Just q quick one

    I am testing a layout for a landing page and need some of the rows with background content — ie colour and video to be Full width

    I created a new page and then choose full width tab and turned off the header and page title

    I added the column and added background content but there still is a GAP showing on live view — I think this is because in the Custom settings I told it to put a gap in the layout — which is needed for the rest of the site normal web pages

    see images to show what happens when I go to the custom settings and change the layout container gaps to 0 left and right — it solves the full page problem but then the normal pages are not correct

    can you provide some CSS to solve or am I going about it the wrong way ?

    is there a css tip to remove gap from any full width columns or is it something incompatible with your theme and eliminator page builder >

    https://www.nationalfamilychildcareassistance.com.au/wp-content/uploads/2016/07/Customise-National-Family-Child-Care-Assistance-2016-07-30-00-02-31.png

    https://www.nationalfamilychildcareassistance.com.au/wp-content/uploads/2016/07/Customise-National-Family-Child-Care-Assistance-2016-07-30-00-01-33.png

    https://www.nationalfamilychildcareassistance.com.au/wp-content/uploads/2016/07/Customise-About-–-National-Family-Child-Care-Assistance-2016-07-30-00-04-00.png

    i need your theme to show their demo layout

    http://demo.elementor.com/landing-page/

    #213894
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I believe I have this fixed in the next version of the theme.

    You can grab the development version to test here: https://github.com/tomusborne/GeneratePress

    #213964
    dasigna

    … sounds (and looks) just like the same problem as here: pading-problems

    elementors guys need to put an eye on that πŸ™‚

    #213969
    Joanne Smith

    yes — It seems to have WORKED at first glance — will play around with it tomorrow — where I can push the booundaries — but the Landing page has a full background with no padding and the main pages have the padding!! Yahoo — it taken me hours to get this fix — going back and forth with other themes and always wanting to use yours!!!

    I also added some Custom CSS for the SMALLER mobile screens from previous threads — and that has worked great too for the H1 and H2 and H3 text —

    I have been telling everyone on blog posts ( and the Elementor developers too ) and even my LinkedIn wordpress group to use your GP theme with Elementor to use to build websites – as you have the Clean THEME and they have the clean page builder — a developers dream web designers toolkit for custom website designs not more off the shelf themes that you can’t do anything with and are stuck with what is out of the box — design by numbers — the same as paint by numbers — now I am free to design what I want to design layout the pages the way I want — no more boring coding — let the designers design and the coders code I say!!

    I think this is the RIGHT combination and takes me back to my Adobe Dreamweaver days and now I can build even MORE professional looking websites with cleaner instant CSS on the fly — most importantly it is front end editor so you get the LIVE view as you design …….and it is indeed as they say…very vert VERY VERY fast to edit.

    They did suggest using a child theme of Twenty Sixteen but it did not have the header and navigation layout controls like you offer ( among-st other items ) — so thank you for a GREAT theme!!

    I hope this help your business model grow!

    Joanne

    #214032
    Tom
    Lead Developer
    Lead Developer

    Thanks, Joanne! Glad you’re finding both tools useful!

    BTW – there are font size controls for h1, h2 and h3 on mobile inside the Typography panel in GP Premium.

    I appreciate the feedback πŸ™‚

    #214045
    Joanne Smith

    did not know it was part of the upgrade — I deleted my custom style sheet and nothing seemed to change –maybe it has something to do with the other program with it sown style sheet

    https://www.nationalfamilychildcareassistance.com.au/wp-content/uploads/2016/07/Customise-National-Family-Child-Care-Assistance-2016-07-30-11-12-57.png

    when I used my custom CSS code it has worked

    https://www.nationalfamilychildcareassistance.com.au/wp-content/uploads/2016/07/Customise-National-Family-Child-Care-Assistance-2016-07-30-11-22-38.png

    see code below


    @media
    (max-width: 768px) {
    .main-title {
    font-size: 25px;
    }

    .entry-content h1 {
    font-size: 24px !important;
    }
    .entry-content h2 {
    font-size: 22px !important;
    }

    .entry-content h3 {
    font-size:18px !important;
    }

    .entry-content p {
    font-size:18px !important;
    }

    .site-logo {
    margin-bottom: 20px;
    }

    .page-header-image.grid-container {
    max-width: 100%;
    }

    .page-header-image img {
    width: 100%;
    }

    .page .wpb_single_image .vc_figure {
    display: inherit;
    }

    }

    #214053
    Tom
    Lead Developer
    Lead Developer

    Hmm, the H1 itself might have an inline style, or as you said another plugin is adding the size with !important or a more specific selector.

    #214107
    Joanne Smith

    a little bit of hand coding now and then is OK as long as you get the right result!!

    J

    #214120
    Tom
    Lead Developer
    Lead Developer

    Very true πŸ™‚

    #216620
    mc208

    Hi Joanne, can I see what you’re doing with GP and Elementor? Just curious I’m planning to do a site with this combination of theme and page builder.

    #216630
    Joanne Smith

    hi

    here is one website completed for a client recently – I had built it about 10 years ago using Macromedia Dreamweaver – HTML with a typical web banner which was the correct web design layout back them – and the client still liked the layout and design BUT wanted it to be mobile friendly – so I upgraded it using both the GP and Elementor but kept the original design. I love the advanced tab where you can add box shadows and borders —

    http://www.hutchwest.com.au

    I am working on another site with a landing page layout that I learned from this video below

    ” Lesson 1 How to Create a Stunning Landing Page on WordPress in Minutes ”

    and then the main pages have correct layout with the Custom CSS as shown above – you have to install a custom CSS plugin and then add the CSS to correct the page layout (when you use the full width page )– the video background on the landing page will be full width.

    hope it helps

    Joanne

    #216631
    mc208

    Pretty cool!

Viewing 15 posts - 1 through 15 (of 25 total)
  • You must be logged in to reply to this topic.