FW

[kar-agnus]

Hello,

I have questions about the Blocks Fullscreen Welcome :

1. I want to remove the Icon font and replace it with a Breadcrum, but i want
to posistion the Breadcrum exactly in the posistion of the Icon font, how do
i do it ?

2. I also would like to remove the Welcome Message and replace it with a logo
will this be stable ? i will also remove the Shape.

Thanks,
Norman

[Pablo]

Blocks are made up out of standard toolbox objects, so you can fully customize them.

1. The "Fullscreen Welcome" block uses a layer so you place the object anywhere you like.

2. The Block can be fully customize. It's a standard layer.

[kar-agnus]

Hello,

I've tried but i cant position the breadcrumb in exactly the same spot where the icon font is.
as much as possible i want the breadcrumb to be in the exact location where the icon font is.

I have a screenshot that i want to attached to this question. can you show me how to attached
a screenshot in this forum ?

Thanks
norman

[BaconFries]

Uploading image(s) directly to the forum has been disabled for security reasons. Alternatively you can either upload to your own host and provide a url or use the following https://imgbb.com/ and again provide the url generated.

If you need further help you can then provide a basic of of your project (.wbs) and sgare it with a url

Please see the following before sharing.
https://www.wysiwygwebbuilder.com/forum ... hp?t=82134

[kar-agnus]

Hello,

Thanks for your reply.
I have uploaded the screenshot, below is the link :

https://ibb.co/tqN1v3M

From the image you can see on the left i already remove the icon font and replaced it with Breadcrumb
when preview both the original Blocks and the one i edited, you can see that i placed the breadcrumb in
the exact location of the icon font, but its not in the same location as shown.

Thanks,
norman

[kar-agnus]

Hello,

I"m using wwb 16.4.4

thanks,

[Pablo]

In the block, the position of the arrow is controlled by the code in 'Html1'.
So, if you replace the arrows with another element, then you will need to update this code.

[kar-agnus]

Hello,

Kindly show me how to update the code in HtML1 in relation to the new element
which is the breadcrumb.

Thanks,
norman

[Pablo]

Replace all instances of 'down-arrow' in the code with the ID of the breadcrumb.

Note that we cannot assist with writing custom code.

[kar-agnus]

Hello,

Thank you for your reply.

Pls. bear with me because i am not a professional web designer i'm using wwb just to improve my company's homepage.
I like the FW it looks nice but im still deciding whether to use it or not, if i feel happy with the outcome i may use it.

I right click the breadcrumb and i see at the very bottom the Object Html. the html only has 5 items in it.
when i click on the Html of FW i see 16 items in it, the 'down-arrow' is indicated on number 2 & 14 is that
what i'm goin to delete and replace ?
Should i copy all the 5 items on the object html of breadcrumb ?

Thanks,
norman

[Pablo]

You do not need to to edit the code of the breadcrumb.
You will need to update the code in object 'HTML1', it is inside the block "Fullscreen Welcome".
In this object, replace all instances of 'down-arrow' with the ID of the breadcrumb (eg. 'Breadcrumb1').

Note this this is one of the few blocks that has custom code to implement special functionality. In this case, some HTML knowledge is required to update the behavior.

[kar-agnus]

Hello,

No i did not edit the code of the breadcrumb.

Just some clarification
Inside object Html there are 16 items there :
- in no 2 there is a symbol before the down-arrow should i delete it before replacing it with breadcrum id ?
- in no 14 there is also a symbol before and there are two words after the down-arrow, should i delete them all
and replace it with breadcrum id ?

thanks,

[Pablo]

You should not edit any symbols. You will only have to change the ID of the object in the code.

Code: Select all

<style>
#wb_Breadcrumb1
{
   top: auto !important; 
   bottom: 25px !important;
   left: 50% !important;
   margin-left: -25px;
}
</style>
<script>
$(document).ready(function()
{
   // move arrow outside the layer container
   $('#wb_Breadcrumb1').appendTo('#welcome');
});
</script>

Assuming that the ID of the breadcrumb menu is 'Breadcrumb1'

[kar-agnus]

Hello,

First time i tried your instruction i was able to get it correctly.
so, Thank you so much for your help.