#128392 Spacing, Responsiveness and Positioning

Landing Forums JupiterX WordPress Theme Spacing, Responsiveness and Positioning

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • kwamearthur86-19f3d1ab

    Hello Guys,

    I am having big Issues with spacing and responsiveness.

    1. Social Media Icons in the Menu is far apart and and it breaks when i switch to a different screen smaller. Also I manually uploaded the medium logo and that is where it breaks.
    2. On the homepage When i switch a different size of browser such as 24inches, i get a different feel. I want the website to be stay intact but the background to stretch to meet the edges but the content should stay the same.
    3. I have 3 boxes in the middle. These boxes have images and Header and a sub header. I cannot seem to make them look as same as the i want I have tried to play around it for long but still the same, Also the background really expands beyond how i want it to look
    4. In the first box is a list of articles, I want to bullet them
    5. The Second Box also have a bullet but i want to make them simple . bullet and the spacing is too much between them.
    6. In the attached document, there is a subscription box from convertkit I want to add this content right under it, but when i put the image on the right and and i add the text, it puts up a big space between the subscription box and the text under it
    Mohsin Al-Rabieai Support Team

    Hi there,

    1 – Social Media Icons in the Menu is far apart and it breaks when i switch to a different screen smaller. Also I manually uploaded the medium logo and that is where it breaks.
    I believe since your design file is having a “Boxed” Header, you should first make the header Boxed in order to reduce the space between the menu and the social icons.

    2 – On the homepage When i switch a different size of browser such as 24inches, i get a different feel. I want the website to be stay intact but the background to stretch to meet the edges but the content should stay the same.
    I don’t recommend using the “Strech section” option unless you really need it. What you want to achieve here would have a better result if you use the “Full Width” template in your page attributes. I recommend you to switch off the “Strech Section” option and use a “Full Width” template in your page instead of the “Default Layout”.

    3 – I have 3 boxes in the middle. These boxes have images and Header and a sub header. I cannot seem to make them look as same as the i want I have tried to play around it for long but still the same, Also the background really expands beyond how i want it to look

    It’s all about padding and margins, sir. You need to play with the different padding and margings on the box and the inner widgets to make what you want. In case you need someone to convert this design for you, feel free to ask for help in WPDone:

    https://wpdone.artbees.net/

    4 – In the first box is a list of articles, I want to bullet them
    It’s not possible by default. I added a CSS class to the Posts element inside that box named “bullet_posts” and then added this CSS to add bullets to Customizer -> Additional CSS to the Posts widgets that have this CSS class.

    .bullet_posts h3.raven-post-title:before {
        content: ' ';
        display: list-item;
        padding: 10px;
        position: absolute;
    }

    Please note that, these kind of customizations are outside of the support scope and you need to ask further questions in WPDone:

    https://wpdone.artbees.net/

    5 – The Second Box also have a bullet but i want to make them simple . bullet and the spacing is too much between them.

    In the scond box, you are using a Popup action button. If your data in the second box is not dynamic, you can use a simple “Text” widget and add a list inside it. Then use hyperlink to add the links to your list items. It would be much easier and the look would be the same as your design.

    6 – In the attached document, there is a subscription box from convertkit I want to add this content right under it, but when i put the image on the right and and i add the text, it puts up a big space between the subscription box and the text under it

    I believe an “Inner Section” widget would be helpful here. You can use an inner section, seperate the content in two columns and in the left column add your image and in the right column, use the subscription form and below it in the same column add your content.

    Hope it helps šŸ™‚

    Private
    kwamearthur86-19f3d1ab
    This reply has been marked as private.
    Nodari Support Team

    Hey there

    I just reviewed your website and it looks like this for me: https://prnt.sc/1lfvymk I don’t have the problem you are facing on your side, may I know the device you used for testing? that can help me identify the problem

    Thanks in advance

    kwamearthur86-19f3d1ab

    Hello Guys,

     

    I have a problem with an inner section that contains the image and the subscription box.

    I have attached an image of how i want it to work. I know its a matter of settings, but i have tried several combinations,it is not working.

     

    also in the footer, i want to use the new logo of mediumĀ  as i did in the header.

     

    Kindly help

    Alexander Hutsol Support Team

    Hello,

     

    1. I changed Content Width to “Boxed” for the Section and Inner Section https://prnt.sc/1mfpuic and now the content isn’t moving. Please check.
    2. As you’re using default footer, you can change the logo in Customizer > Widgets > Footer 1 https://prnt.sc/1mfr4jj , edit the Image widget and upload a new logo.

    Thank you.

    Regards.

    kwamearthur86-19f3d1ab

    Hello,

    1. Correct

    2. I want to change the images if the social media icons

    Alexander Hutsol Support Team

    Hello,

     

    If you want to set different images for social icons in the footer, you need to create a custom Footer template instead of using the default footer and add custom icons there.

     

    Thank you.

    Regards.

    Private
    kwamearthur86-19f3d1ab
    This reply has been marked as private.
    Amir Rather Support Team

    Hi There

    Try the below CSS in Page Settings > Advanced > Custom CSS https://take.ms/BweIq on this page:

    .raven-post-title{
        border-bottom: 1px solid #FFCC0D;
    }

    Regards

    Private
    kwamearthur86-19f3d1ab
    This reply has been marked as private.
    Nodari Support Team

    Hi

    You may add some padding, try this code:

    .raven-post-title {
        border-bottom: 2px solid #FFCC0D;
        padding-bottom: 8px;
    }

    If it’s still not the same please provide a direct link to the page from your screenshot

Viewing 12 posts - 1 through 12 (of 12 total)
You must be logged in to reply to this topic.
Login