Add contact section for Fax number

[Matthew_McGahren]

Simple, area for Fax number.

[Max]

Hi there @Matthew_McGahren

Nice idea, thanks for sharing! Let’s see if it catches on with the community

However, I am happy to say that our devs came up with a custom solution for you:

const FAX_TEXT = 'FAX: ';
const FAX_NUMBER = '777-777-888';

const LISTEN_TYPES = {
	one: {
		select: (selector, root) => root.querySelector(selector),
		validate: (node) => !!node,
	},
	all: {
		select: (selector, root) => root.querySelectorAll(selector),
		validate: (node) => node?.length > 0,
	},
};
function listenStep(args) {
	args.node = args.select(args.selector, args.root);
	if (!args.validate(args.node)) {
		args.step++;
		if (args.step < args.limit)
			setTimeout(() => {
				listenStep(args);
			}, args.delay);
		else args.reject();
	} else {
		args.resolve(args.node);
	}
}
async function asyncListenFor(selector, type = 'one', customArgs = {}) {
	const args = {
		root: document,
		node: undefined,
		selector,
		delay: 100,
		limit: 50,
		step: 0,
		select: LISTEN_TYPES[type].select,
		validate: LISTEN_TYPES[type].validate,
		...customArgs,
	};
	if (type === 'one' || type === 'all') {
		return new Promise((resolve, reject) => {
			listenStep({ ...args, resolve, reject });
		});
	}
}

asyncListenFor('.elfsight-app-a87e610e-ca5b-4490-a11e-cfcba2c90f44 > div').then(
	(widgetContainer) => {
		const container = widgetContainer.querySelector(
			'[class*="multi-column-layout__Column-sc"]'
		);
		console.log(container);

		if (container && container.children.length >= 2) {
			const secondChild = container.children[1];

			const clonedChild = secondChild.cloneNode(true);
			console.log(clonedChild);
			const faxText = clonedChild.querySelector(
				'[class*="contacts-item__UnderlineWrapper-sc"]'
			);
			console.log(faxText);
			faxText.textContent = `${FAX_TEXT}${FAX_NUMBER}`;
			faxText.setAttribute('href', `fax:${FAX_NUMBER}`);

			if (container.children.length >= 3) {
				container.insertBefore(clonedChild, container.children[2]);
			} else {
				container.appendChild(clonedChild);
			}
		}
	}
);

This code should be added to the Custom JS field on the Style tab of your widget’s setting

This code adds a line for the fax.

FAX_TEXT is a text between the icon and the number. If you don’t need it, just leave empty quotes, (" ‘’)

FAX_NUMBER is the actual fax number.

Check it out and let me know if you like the result

[Matthew_McGahren]

Amazing, Thank you!